iframe - body - 替换innerHTML事件侦听器无法正常工作

在我替换了innerHTML事件侦听器中的IP地址后无法正常工作。iframe - body - 替换innerHTML事件侦听器无法正常工作

我的代码：

$("iframe").load(function() { 
    $("iframe").contents().find("b").html(function(_, html) { 
     return html.replace(/(\b\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}\b)/, '<a href="http://$1/" target="_blank">$1</a>'); 
    }); 
});

在IFRAME的innerHTML的一部分

<a id="go" rel="leanModal" name="test_2" href="#event">2</a> <!--this anchor loses event listener --> 
    <li> 
     <ul> 
      <li> 
       <b>MyRouter1 - 192.168.1.1</b> 
      </li> 
      <li> 
       <b>MyRouter2 - 192.168.1.2</b> 
      </li> 
     </ul> 
    </li>

如何使IP地址的点击，而无需更换的innerHTML或杀死DOM元素/事件监听器？

来源

2015-02-09 Kublach

什么事件侦听器（S）？你是如何将它们绑定到什么元素上的？ – MrUpsidown 2015-02-09 17:00:45

你想在你插入的'a'节点上使用事件监听器吗？ – Halcyon 2015-02-09 17:02:32

**不清楚你要问什么** _请说明你的具体问题或添加额外的细节，以确切地突出你所需要的。正如目前所写，很难确切地说出你在问什么。请参阅[如何提问]页面帮助澄清此问题._ – melancia 2015-02-09 17:08:35

如果您想要创建事件侦听器，即使在HTML更改后仍然可以继续工作，请查看$ .on（）。您可以使用它将侦听器放置在身体上，当与选择器相匹配的孩子发生事件时将触发身体。例如：

$("body").on("click", "a",function(event){ doSomething(); });

上面的代码将调用它的事件处理程序被点击的a标签的任何时间。您可以将"a"替换为您要收听的元素的选择器。即使DOM发生更改，它也将继续工作，因为听众位于body。

编辑：看来您可能正在使用JavaScript来编辑您没有创建的现有页面。在这种情况下，编辑标记会很困难，因为您无法控制事件侦听器是如何创建的，而不会中断事件侦听器。另外，由于您在现有的a中插入a标签，因此此特定问题可能与以下事实有关：您的替换会导致无效标记。

作出元素点击不与内部HTML搞乱，也样式它，使之清楚，这是可以点击：

$("b").click(function(event){ 
    //handle your click here 
    //window.location = "http://someurlhere" 
}).css({"color":"blue","cursor":"pointer"});

来源

2015-02-09 17:38:00 devinallenaz

是的，我正在编辑我没有创建的页面。有没有其他的方法来创建可点击的IP地址？ – Kublach 2015-02-09 17:48:28

我已更新我的答案，以显示如何处理JavaScript中的点击事件。您可以在事件处理程序中添加正则表达式逻辑来生成所需的URL。 – devinallenaz 2015-02-09 19:14:44

谢谢。这是解决方案... :) – Kublach 2015-02-10 11:31:20

iframe - body - 替换innerHTML事件侦听器无法正常工作

回答

相关问题