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

Call Javascript function multiple times in a foreach loop

本文关键字：调用 Javascript 函数 foreach 循环      更新时间：2023-09-26

我有一个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;
}

您的方法有很多问题，我将尝试列举它们。

  1. 您在DOM（button）中使用重复ID。ID应唯一
    使用类可重复性。有关详细信息，请查看HTML规范。

  2. jQuery选择器正在使用ID将click函数绑定到按钮
    每次添加按钮时，都会将所有按钮绑定到该函数。

  3. 您应该有一个接收事件的通用单击函数
    查看jQuery文档，了解从事件中获取单击的元素的方法。

这只会对你有一点点帮助。最后一英里包括将项目URL添加到您的button或li。

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

最后，将script标记添加到DOM的末尾，或者添加到封装在$(document).ready()调用中的头/单独文件中。最好是在所有内容都完成加载后才运行。

相关文章：