Question

现在我正在开发一个简单的HTML / Jquery页面。在我的代码中，我试图重新加载特定的这是我的代码，请查看：

<script type="text/javascript">
$(document).ready(function() {
$( "#Reload" ).each(function(index) {
    $(this).on("click", function(){
    $('#IframeReload')[0].contentWindow.location.reload(true);
    });
 });
 }); 
</script>

这是HTML代码：

<iframe id="IframeReload" src="suggestions.php?id=<?PHP echo $membid;?>" target="_parent">Browser not compatible.</iframe>


<div id="Reload" class="tooltip1" style="cursor:pointer;"></div>
<div id="Reload" class="tooltip2" style="cursor:pointer;"></div>
<div id="Reload" class="tooltip3" style="cursor:pointer;"></div>

正如你所看到的，我有许多带ID和＃34的元素;重新加载＆＃34;。使用此代码示例时，我只按下第一个显示的元素，ID为＃34;重新加载＆＃34; iframe正在重新加载，就像它重新加载，但当我点击任何其他div元素与id＆＃34;重新加载＆＃34;没有任何事情发生，这就是问题所在。

如何通过点击id为＃34;重新加载＆＃34;？

的每个元素，让我的jQuery代码重新加载iframe

提前致谢！

Answer 1

问题在于您的引用方式。

$("#Reload")

上面的代码选择带有该ID的第一个元素。

$("[id=Reload]")

这将允许您选择具有相同ID的所有元素。

你应该做的是通过classname应用事件 - 这将更整洁。

<div class="reload tooltip1" style="cursor:pointer;"></div>
<div class="reload tooltip2" style="cursor:pointer;"></div>
<div class="reload tooltip3" style="cursor:pointer;"></div>

<script type="text/javascript">
    $(document).ready(function() {
        $('.reload').on("click", function(){
            $('#IframeReload')[0].contentWindow.location.reload(true);
        });
     }); 
</script>

您应该保持元素ID属性的唯一性。

Answer 2

ID在页面上应该是唯一的。

<div class="reload tooltip1" style="cursor:pointer;"></div>
<div class="reload tooltip2" style="cursor:pointer;"></div>
<div class="reload tooltip3" style="cursor:pointer;"></div>

<script type="text/javascript">
    $(document).ready(function() {
        $('.reload').click(function(){
            $('#IframeReload')[0].contentWindow.location.reload(true);
        });
     }); 
</script>

Answer 3

您需要为网页中的每个元素添加唯一ID。您应该做的是创建一个重新加载页面的JavaScript函数，然后将每个div上的click侦听器分配给该函数。

另一种方法是使用公共类，而不是使用ID，然后为该类设置click侦听器。

jQuery iframe由具有相同ID的许多元素重新加载？

3 个答案: