包含 javascript 的附加 HTML 无法运行,如何使其运行?

发布于 2024-07-14 07:12:18 字数 516 浏览 5 评论 0原文

我正在附加一些包含 javascript 的 HTML。

<td onclick="toggleDay('+data+',this,\'tue\');">T</td>

<img src="img/cross.png" onclick="deleteAlarm('+data+');">

两段代码位于我附加的大量 HTML 中。

如果它们在页面加载时已经存在但在我附加时不存在,则它们可以正常工作。

你建议我做什么? DOM 是否需要某种排序请求才能在追加后重新解释 JavaScript?

编辑:

只是更多信息,我遇到了这个问题,因为我正在使用 AJAX 添加一些内容到数据库中,并且成功后我会将 html 附加到需要的位置。 有点像SO处理评论的方式。

Edit2:

即使有所有关于它的讨论,感谢您的回答,让它工作。

I'm appending some HTML containing javascript.

<td onclick="toggleDay('+data+',this,\'tue\');">T</td>

and

<img src="img/cross.png" onclick="deleteAlarm('+data+');">

These two pieces of code are in the big amount of HTML I'm appending.

They work fine if they are already there when the page loads but not when I'm appending.

What do you suggest me to do? Is it needed some sort request for the DOM to re-interpret the JavaScript after the append or?

EDIT:

Just some more info, I'm with this problem, because I'm adding some stuff with AJAX to the database, and on success I'm appending the html to where it needs to be. Kinda the same way SO does with the comments.

Edit2:

Even with all the discussion about it, thanks for the answers, got it working.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

她比我温柔 2024-07-21 07:12:18

我会这样做:

首先将 id 属性添加到您的 html 中:

<td id="toggleDayCell">T</td>

<img src="img/cross.png" id="crossImg">

让 Javascript 在页面的 onload 事件上运行并附加到您感兴趣的事件。

然后 .prototypejs.org" rel="nofollow noreferrer">PrototypeJS,它可能看起来像这样:

Event.observe(window, 'load', function(){
  if( $('toggleDayCell') ) {
    Event.observe( $('toggleDayCell'), 'click', function(event){
      //do stuff here
    }
  }

  if( $('crossImg') ) {
    Event.observe( $('crossImg'), 'click', function(event) {
       //do stuff here
    }
  }
});

使用 Prototype(或 jQuery)之类的东西很好,因为它可以处理跨浏览器兼容性。

I'd do it like this:

First add id attributes to your html:

<td id="toggleDayCell">T</td>

<img src="img/cross.png" id="crossImg">

Then have Javascript that runs on the onload event of the page and attaches to the events you're interested in.

In PrototypeJS, it might look like this:

Event.observe(window, 'load', function(){
  if( $('toggleDayCell') ) {
    Event.observe( $('toggleDayCell'), 'click', function(event){
      //do stuff here
    }
  }

  if( $('crossImg') ) {
    Event.observe( $('crossImg'), 'click', function(event) {
       //do stuff here
    }
  }
});

Using something like Prototype (or jQuery) is nice because it takes care of cross-browser compatibility.

无所的.畏惧 2024-07-21 07:12:18

您是否通过 AJAX 附加 HTML? 如果是这样,您将必须手动 eval() 您返回的 JavaScript。 您可以将响应包装在 div 中并执行以下操作:

wrapper.getElementsByTagName("script")
// for script in wrapper...
eval(script.innerHTML)

如果您使用类似原型的库,那么会简单得多,因为您可以将响应传递给 evalScripts() 方法。

Are you appending the HTML via AJAX? If so you will have to manually eval() the JavaScript that you are returning. You could wrap the response in a div and do something like this:

wrapper.getElementsByTagName("script")
// for script in wrapper...
eval(script.innerHTML)

If you are using a library like prototype it would be much simpler as you can pass the response to the evalScripts() method.

沙沙粒小 2024-07-21 07:12:18

将 HTML 附加到文档,然后以编程方式将 onclick 事件添加到对象。

这超出了我的想象,但是......我认为你可以这样做:

IE:

Object.onclick = someFuntion

FF:

Object.addEventListener('click', someFunction);

Append the HTML to the document then programatically add the onclick event to the object.

This is off the top of my head but... I think you can do it this way:

IE:

Object.onclick = someFuntion

FF:

Object.addEventListener('click', someFunction);
情绪操控生活 2024-07-21 07:12:18

AJAX 有一些怪癖......尤其是对于 IE。 示例:您不能使用innerHTML 属性在表元素(在IE 中)中插入/更新任何内容。 最好使用 DOM 函数来插入/更新/删除元素节点(或添加事件处理程序)。 您可以使用提到的 eval() 函数来运行动态加载的 javascript,以使用 DOM 对象修改文档。

AJAX has some quirks... especially with IE. Example: you cannot use the innerHTML property to insert/update anything in a table element (in IE). It's better to use the DOM functions to insert/update/delete element nodes (or add event handlers). You can use the eval() function mentioned to run dynamically loaded javascript that modifies the document using DOM objects.

傾旎 2024-07-21 07:12:18

应该使用addEventListener('click', /*...*/)而不是在innerHTML或其他内容中设置onclick。

IE 完全调用了 addEventListener ,因此您也必须对此进行补偿。

(编辑:IE 称之为 attachEvent()。希望这有一些用处。)

You should be using addEventListener('click', /*...*/) instead of setting onclick in innerHTML or whatever.

IE calls addEventListener something else entirely, so you'll have to compensate for that too.

(Edit: IE calls it attachEvent(). Hope this is of some use.)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文