jQuery设置元素的属性答案

【问题标题】：JQuery set attribute of an elementjQuery设置元素的属性
【发布时间】：2011-03-31 22:42:08
【问题描述】：

在下面的代码中

      <script>
       $(document).ready(function() {
     if(load_flag  == 0)
     {
        var html = '';
        html += "<div id ='err_msg' style='display:none;'><b>Preview errors</b> <br></div>";
        html += "<div id ='cont' style='display:none;'><input type='button' value='Continue' onclick='javascript:save();' /></div>";

     //some more processing
      if(err_flag != 1)
      {

        $("#err_msg").css({"display" : "block"});
        $("#cont").css({"display" : "block"});
      }
        $("#tabledata").append(html);
    });
   </script> 

  <div id="tabledata"></div>

err_msg 显示，但 id=cont 样式仍然 style=none 代码有什么问题

【问题讨论】：

标签： jquery jquery-plugins jquery-selectors jquery-validate

【解决方案1】：

问题是，您没有将 ID="err_msg" 和 ID="cont" 的元素插入到文档中。首先运行 $("#tabledata").append(html);然后进行 CSS 更改。

$("#tabledata").append(html);
if(err_flag != 1)
{
   $("#err_msg").css({"display" : "block"});
   $("#cont").css({"display" : "block"});
}

【讨论】：

【解决方案2】：

而不是这个：

$("#err_msg").css({"display" : "block"});
$("#cont").css({"display" : "block"});

试试这个：

$("#err_msg").show();
$("#cont").show();

此外，在您正在构建的那个 HTML 字符串中，您有一个这样的 onclick 处理程序：

onclick='javascript:save();'

暂且不论是否最好在此处分配处理程序，您应该这样做：

onclick='save();'

onclick 处理程序被理解为 JavaScript。

更新：再次仔细查看您的代码，看起来在您运行“显示”逻辑（或样式分配）时，DOM 中尚不存在元素 - - 它们只是您构建的字符串的一部分。您在尚不存在的元素上运行“显示”逻辑（因此没有任何反应），然后然后将它们附加到#tabledata（没有更改已应用它们的可见性）。这似乎不合顺序，除非我遗漏了什么。

由于无论可见性如何都会发生追加，因此更改顺序没有害处：

$("#tabledata").append(html);
if( err_flag !== 1 ) {
    $("#err_msg").show();
    $("#cont").show();
}

【讨论】：

【解决方案3】：

不应将$("#tabledata").append(html); 排在// some more processing 之前。我通常将 css 属性用作 $('selector').css('display', 'block') - 无需在那里创建对象。另一个建议是使用 .hide/.show 函数来控制可见性（适用于所有浏览器的所有元素）。

【讨论】：