Question

我有一个foreach循环生成的搜索结果列表。我试图在每个结果中添加一个按钮，在iframe窗口中打开每个搜索结果，但只有第一个结果有效，而不是其他结果。我希望能够在同一页面中的iframe中打开一个或多个结果。并能够通过单击另一个按钮关闭它们。有任何想法吗？感谢

     foreach($this->result['web']->results->result as $item) {
 echo "<ul>";
 echo "<li><a href='".$item->url."'>".$item->title."</a></li>";
 echo "<li>".$item->abstract."</li>";
 echo "<script>$(function(){
 $('#button').click(function(){
 if(!$('#iframe').length) {
 $('#iframeHolder').html('<iframe id=\"iframe\" src=\"".$item->url."\"    width=100% height=\"600\"></iframe>');
}
});   
});</script>";       
echo"<li><a id=\"button\">Open</a></li>";
echo"<div id='iframeHolder'></div>";
echo "</ul>";
}
return true;
}

Answer 1

您的方法存在许多问题，我会尝试枚举它们。

您在DOM中使用重复 ID（button）。 ID应唯一使用类可重复性。查看HTML specification了解详情。
您的jQuery选择器正在使用ID将点击功能绑定到按钮每次添加按钮时，都会将所有按钮绑定到该功能。
您应该有一个通用点击功能，可以接收事件。
检查jQuery docs是否有从事件中获取被点击元素的方法。

这只会对你有所帮助。最后一英里包括将商品网址添加到您的button或li。

我建议使用data-x属性，您可以使用jQuery的#data()函数（例如target.data('x')）来获取该属性。例如，为了避免将属性值设置为项URL，请将其设置为数组索引。

最后，将您的script标记添加到DOM的末尾，或者包含在$(document).ready()调用中的头/单独文件中。如果它只在> 所有内容完成加载后运行

在foreach循环中多次调用Javascript函数

1 个答案: