JavaScript:使用或不使用 jQuery 更改 onclick 的值 [英] JavaScript: changing the value of onclick with or without jQuery
问题描述
我想更改锚点上 onclick 属性的值.我想将其设置为包含 JavaScript 的新字符串.(该字符串由服务器提供给客户端 JavaScript 代码，它可以包含您可以放入 HTML 中的 onclick 属性中的任何内容.)以下是我尝试的一些操作:
I'd like to change the value of the onclick attribute on an anchor. I want to set it to a new string that contains JavaScript. (That string is provided to the client-side JavaScript code by the server, and it can contains whatever you can put in the onclick attribute in HTML.) Here are a few things I tried:
- 使用 jQuery
attr("onclick", js)不适用于 Firefox 和 IE6/7. - 使用
setAttribute("onclick", js)适用于 Firefox 和 IE8，但不适用于 IE6/7. - 使用
onclick = function() { return eval(js);}不起作用，因为您不允许使用return是传递给eval()的代码.
- Using jQuery
attr("onclick", js)doesn't work with both Firefox and IE6/7. - Using
setAttribute("onclick", js)works with Firefox and IE8, but not IE6/7. - Using
onclick = function() { return eval(js); }doesn't work because you are not allowed to usereturnis code passed toeval().
有人建议设置 onclick 属性以使其适用于 Firefox 和 IE 6/7/8?另请参阅下面我用来测试的代码.
Anyone has a suggestion on to set the onclick attribute to to make this work for Firefox and IE 6/7/8? Also see below the code I used to test this.
<html>
<head>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var js = "alert('B'); return false;";
// Set with JQuery: doesn't work
$("a").attr("onclick", js);
// Set with setAttribute(): at least works with Firefox
//document.getElementById("anchor").setAttribute("onclick", js);
});
</script>
</head>
<body>
<a href="http://www.google.com/" id="anchor" onclick="alert('A'); return false;">Click</a>
</body>
</html>
推荐答案
如果你使用 jQuery，你不应该再使用 onClick.jQuery 提供了自己的附加和绑定事件的方法.请参阅 .click()
You shouldn't be using onClick any more if you are using jQuery. jQuery provides its own methods of attaching and binding events. See .click()
$(document).ready(function(){
var js = "alert('B:' + this.id); return false;";
// create a function from the "js" string
var newclick = new Function(js);
// clears onclick then sets click using jQuery
$("#anchor").attr('onclick', '').click(newclick);
});
这应该取消 onClick 功能 - 并保留您的javascript from a string".
That should cancel the onClick function - and keep your "javascript from a string" as well.
最好的办法是从 HTML 代码中的 <a> 元素中删除 onclick="" 并切换到使用 Unobtrusive 将事件绑定到点击的方法.
The best thing to do would be to remove the onclick="" from the <a> element in the HTML code and switch to using the Unobtrusive method of binding an event to click.
你也说过:
使用 onclick = function() { return eval(js);} 不起作用，因为您不允许在传递给 eval() 的代码中使用 return.
Using
onclick = function() { return eval(js); }doesn't work because you are not allowed to use return in code passed to eval().
不 - 它不会，但是 onclick = eval("(function(){"+js+"})"); 会将 'js' 变量包装在函数外壳中.onclick = new Function(js); 也可以，而且阅读起来更简洁.(注意大写 F)——参见 关于 Function() 的文档构造函数
No - it won't, but onclick = eval("(function(){"+js+"})"); will wrap the 'js' variable in a function enclosure. onclick = new Function(js); works as well and is a little cleaner to read. (note the capital F) -- see documentation on Function() constructors
这篇关于JavaScript:使用或不使用 jQuery 更改 onclick 的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
