0

是的，我是 jquery 和 javascript 的新手。我有一个页面，其中包含静态 html 和 python 生成的数据，这些数据通过 ajax 写入页面。我有一个 jquery 滑块，它适用于页面中已经存在的静态 html 数据，但不适用于新更新的内容。我尝试将 jquery 滑块代码放在静态 html 页面以及外部 javascript 源页面中。两者都不起作用。只有当我将 jquery 滑块代码放在将新数据写入页面的 python 脚本中时，它才会起作用，我真的不喜欢导入下一组动态数据时发生的情况。不知道我做错了什么......

jQuery代码：

$(document).ready(function(){
  $(".noIbar").click(function(e){
    if (e.ctrlKey)
      {
        $(this).next(".panel").slideToggle("fast");
      }
  });
});

这是代码工作部分的屏幕截图。当用户按住控制键并单击第一行（静态 html）时，它可以工作，但是通过 python 脚本返回的第二行不工作。我觉得这与 jquery 的调用方式有关。

我通过 body 标记中的 onload 调用 ajax 脚本：

<body  onload="test();loadcontent();">

这是'loadcontent（）'函数：

function loadcontent()
{
$(document).ready(function(){    
$.get('cgi-bin/content.py', function(data) {
    $("#content").append(data);
});
});
}

这是 python 脚本的确切输出：

<div class='noIbar' onclick="highlightLink(this);AddVar('1.2.840.113970.3.33.1.16671800.20120327.1134351')">
  <div class='data'>105630</div>
  <div class='data'>ISO_IR 100</div>
  <div class='data'>20120327</div>
  <div class='data'>135346.000</div>
  <div class='data'>00035MR120014044</div>
  <div class='endcap'>2681</div>
</div>
<div class='panel'>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.8.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.9.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.10.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.11.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.12.jpg"></div>
</div>

<div class='noIbar' onclick="highlightLink(this);AddVar('1.2.840.113970.3.33.1.14883629.20111109.1132327')">
  <div class='data'>121011</div>
  <div class='data'>ISO_IR 100</div>
  <div class='data'>20111109</div>
  <div class='data'>133143.000</div>
  <div class='data'>00035US110137393</div>
  <div class='endcap'>US OB</div>
</div>
<div class='panel'>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.8.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.9.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.10.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.11.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.12.jpg"></div>
4

1 回答 1

1

这是解决您的问题的方法：

$(document).ready(function(){    
    $.get('cgi-bin/content.py', function(data) {
        $("#content").append(data);
        $(".noIbar").click(function(e){
            if (e.ctrlKey)
            {
                $(this).next(".panel").slideToggle("fast");
            }
        });
    });
});

您在 ajax 调用之前添加了回调函数。从您的 python 脚本获得响应后，您正在向 DOM 添加内容，添加的新内容将不会响应回调事件，除非您再次为新元素定义它们。

于 2013-02-11T07:33:30.473 回答