时间戳

首页 > 解决方案 > jQuery 问题无法检索或设置属性，“未定义”

javascript - jQuery 问题无法检索或设置属性，“未定义”

问题描述

我有一个 img 元素。该图像元素在鼠标悬停时将显示详细的工具提示。

我正在尝试使 img 元素默认开始为空 null，并在加载时从工具提示中提供图像信息。

我无法使用 $('idName').attr(a,b); 检索或分配属性；

html和js如下：

<div class="col-sm-6 text-left"> 
      <h1>Member Equipment</h1>
      <p>-Show member equipment-</p>
      <table class="table">
        <tbody>
          <tr>
            <td><img id="primary" class="img-responsive" src="" alt="Primary"
                onmouseover="document.getElementById('primary_tool_tip').style='display:block'"
                onmouseleave="document.getElementById('primary_tool_tip').style='display:none'">
                <div id="primary_tool_tip" class="bottom" style="display:none">
                    <img id="tooltip_img" src="../images/sword01.jpg" /> 
                    <div id="tooltip_name">Bronze Sword</div>
                    <div id="tooltip_equipslots">Primary, Secondary</div>
                    <div id="tooltip_attributes">STR+2 DEX+2</div>
                    <div id="tooltip_elements">Fire+5</div>
                </div>
            </td>

            <td id="secondary"><img class="img-responsive" src="" alt="Secondary"></td>
            <td id="ranged"><img class="img-responsive" src="" alt="Ranged"></td>
            <td id="ammo"><img class="img-responsive" src="" alt="Ammo"></td>

JS

alert($("tooltip_img").attr("src"));


function initialize(){
$('primary').prop('src', $('tooltip_img').attr('src') );    
}


window.addEventListener("load", initialize, false );

标签： javascriptjqueryhtmlattributes

解决方案

将所有 JavaScript 放在一个 JQuerydocument.ready()函数中，以便在 DOM 加载并准备好与之交互之前它不会执行。

然后，确保您使用正确的选择器。

  • Tag Name 通过元素名称获取元素。
  • 前置#按 ID 获取元素
  • 前置.按类名获取元素

所以大家一起：

// The contents of an anonymous function that is passed to JQuery
// won't run until the DOM is parsed and ready to be interacted with.
// This is also known as a "document.ready()" function.
$(function(){
  alert($("#tooltip_img").attr("src"));

  function initialize(){
    $('#primary').prop('src', $('#tooltip_img').attr('src') );    
  }

  window.addEventListener("load", initialize, false );
});

推荐阅读