blocks|key|342505|text|Jquery的一个问题是，click函数不会确认来自html的手动编码onclick。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|342506|所以，你必须做出选择。在init函数中设置所有处理程序，或者在html中设置所有处理程序。|342507|JQuery中的单击事件是单击函数$("myelt").click+(Function...)。|342508|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|H|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|I|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|J|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|G|$]]

One gotcha with Jquery is that the click function do not acknowledge the hand coded onclick from the html.

So, you pretty much have to choose. Set up all your handlers in the init function or all of them in html. 

The click event in JQuery is the click function $("myelt").click (function ....).

blocks|key|3114837|text|如果您使用的是jQuery，则不应该再使用onClick。jQuery提供了自己的附加和绑定事件的方法。请参阅.click()|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3114838|$(document).ready(function(){
++++var+js+=+"alert('B:'+%2B+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);
});|code-block|syntax|javascript|3114839|这应该会取消onClick函数--同时保留你的“字符串中的javascript”。|3114840|最好的做法是从HTML代码的<a>元素中删除onclick=""，并切换到使用将事件绑定到click的方法。|3114841|你还说：|3114842|使用onclick+=+function()+{+return+eval(js);+}的|3114843|不起作用，因为不允许在传递给eval()的代码中使用return。|blockquote|3114844|3114845|3114846|不-它不会，但onclick+=+eval("(function(){"%2Bjs%2B"})");将'js‘变量包装在一个函数封装中。onclick+=+new+Function(js);也能工作，而且读起来更干净一些。(注意大写的F)+--参见documentation+on+Function()+constructors|3114847|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/click|1|https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Function^0|L|7|1J|8|1J|8|0|0|0|6|7|0|E|3|M|A|0|0|2|15|0|0|0|0|7|13|1S|R|3T|A|3C|14|1|0^^$0|@$1|2|3|4|5|6|7|19|8|@$9|1A|A|1B|B|C]|$9|1C|A|1D|B|C]]|D|@$9|1E|A|1F|1|1G]]|E|$]]|$1|F|3|G|5|H|7|1H|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|1I|8|@$9|1J|A|1K|B|C]]|D|@]|E|$]]|$1|M|3|N|5|6|7|1L|8|@$9|1M|A|1N|B|C]|$9|1O|A|1P|B|C]]|D|@]|E|$]]|$1|O|3|P|5|6|7|1Q|8|@]|D|@]|E|$]]|$1|Q|3|R|5|6|7|1R|8|@$9|1S|A|1T|B|C]]|D|@]|E|$]]|$1|S|3|T|5|U|7|1U|8|@]|D|@]|E|$]]|$1|V|3|-4|5|6|7|1V|8|@]|D|@]|E|$]]|$1|W|3|-4|5|6|7|1W|8|@]|D|@]|E|$]]|$1|X|3|Y|5|6|7|1X|8|@$9|1Y|A|1Z|B|C]|$9|20|A|21|B|C]|$9|22|A|23|B|C]]|D|@$9|24|A|25|1|26]]|E|$]]|$1|Z|3|-4|5|6|7|27|8|@]|D|@]|E|$]]]|10|$11|$5|12|13|14|E|$15|16]]|17|$5|12|13|14|E|$15|18]]]]

You shouldn't be using <code>onClick</code> any more if you are using jQuery. jQuery provides its own methods of attaching and binding events. See <a href="http://api.jquery.com/click" rel="noreferrer"><code>.click()</code></a>

<pre><code>$(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);
});
</code></pre>

That should cancel the <code>onClick</code> function - and keep your "javascript from a string" as well.

The best thing to do would be to remove the <code>onclick=""</code> from the <code>&lt;a&gt;</code> element in the HTML code and switch to using the <a href="http://en.wikipedia.org/wiki/Unobtrusive_JavaScript" rel="noreferrer">Unobtrusive</a> method of binding an event to click.

You also said:

<blockquote>
 Using <code>onclick = function() { return eval(js); }</code> doesn't work because you are not allowed to use return in code passed to eval().
</blockquote>

No - it won't, but <code>onclick = eval("(function(){"+js+"})");</code> will wrap the 'js' variable in a function enclosure. <code>onclick = new Function(js);</code> works as well and is a little cleaner to read. (note the capital F) -- see <a href="https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Function" rel="noreferrer">documentation on <code>Function()</code> constructors</a>

blocks|key|3114865|text|只需使用事件绑定方法！jQuery+-jquery！.bind(‘event’，!fn!)；|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3114866|See+here+for+more+about+events+in+jQuery|offset|length|3114867|entityMap|0|LINK|mutability|MUTABLE|url|http://docs.jquery.com/Events^0|0|0|14|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@$D|P|E|Q|1|R]]|A|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|M]]]]

just use jQuery bind method !jquery-selector!.bind('event', !fn!);

<a href="http://docs.jquery.com/Events" rel="nofollow noreferrer">See here for more about events in jQuery</a>

blocks|key|343501|text|想出了一个又快又脏的解决办法。刚刚使用的<select+onchange='this.options[this.selectedIndex].onclick();>+<option+onclick='alert("hello+world")'+></option>+</select>|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|343502|希望这能有所帮助|343503|entityMap^0|K|3E|0|0^^$0|@$1|2|3|4|5|6|7|J|8|@$9|K|A|L|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|M|8|@]|D|@]|E|$]]|$1|H|3|-4|5|6|7|N|8|@]|D|@]|E|$]]]|I|$]]

Came up with a quick and dirty fix to this. Just used <code>&lt;select onchange='this.options[this.selectedIndex].onclick();&gt; &lt;option onclick='alert("hello world")' &gt;&lt;/option&gt; &lt;/select&gt;</code>

Hope this helps

blocks|key|3114915|text|如果您不想实际导航到新页面，也可以将锚点放在页面上的某个位置，如下所示。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3114916|<a+id="the_anchor"+href="">|code-block|syntax|javascript|3114917|然后将您的JavaScript字符串分配给锚点的onclick，将其放在其他位置(即标题，主体后面的内容)：|3114918|<script>
++++var+js+=+"alert('I+am+your+string+of+JavaScript');";+//+js+is+your+string+of+script
++++document.getElementById('the_anchor').href+=+'javascript:'+%2B+js;
</script>|3114919|如果您在发送页面之前已经在服务器上获得了所有这些信息，那么您也可以简单地将JavaScript直接放在锚的href属性中，如下所示：|offset|length|style|CODE|3114920|<a+href="javascript:alert('I+am+your+script.');+alert('So+am+I.');">Click+me</a>|3114921|entityMap^0|0|0|0|0|1H|4|0|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|W|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|Y|8|@$M|Z|N|10|O|P]]|9|@]|A|$]]|$1|Q|3|R|5|D|7|11|8|@]|9|@]|A|$E|F]]|$1|S|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|T|$]]

If you don't want to actually navigate to a new page you can also have your anchor somewhere on the page like this.

<pre><code>&lt;a id="the_anchor" href=""&gt;
</code></pre>

And then to assign your string of JavaScript to the the onclick of the anchor, put this somewhere else (i.e. the header, later in the body, whatever):

<pre><code>&lt;script&gt;
 var js = "alert('I am your string of JavaScript');"; // js is your string of script
 document.getElementById('the_anchor').href = 'javascript:' + js;
&lt;/script&gt;
</code></pre>

If you have all of this info on the server before sending out the page, then you could also simply place the JavaScript directly in the <code>href</code> attribute of the anchor like so:

<pre><code>&lt;a href="javascript:alert('I am your script.'); alert('So am I.');"&gt;Click me&lt;/a&gt;
</code></pre>

blocks|key|342600|text|请注意，按照gnarf的想法，您也可以这样做：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|342601|var+js+=+"alert('B:'+%2B+this.id);+return+false;"; 
var+newclick+=+eval("(function(){"%2Bjs%2B"});"); 
$("a").get(0).onclick+=+newclick;|code-block|syntax|javascript|342602|这将在不触发事件的情况下设置onclick+(这里也有同样的问题，我花了一些时间才弄清楚)。|342603|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Note that following gnarf's idea you can also do:

<pre><code>var js = "alert('B:' + this.id); return false;";&lt;br/&gt;
var newclick = eval("(function(){"+js+"});");&lt;br/&gt;
$("a").get(0).onclick = newclick;
</code></pre>

That will set the onclick without triggering the event (had the same problem here and it took me some time to find out).

blocks|key|343534|text|顺便说一句，没有JQuery也可以做到这一点，但显然它相当丑陋，因为它只考虑IE/非IE：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|343535|if(isie)
+++tmpobject.setAttribute('onclick',(new+Function(tmp.nextSibling.getAttributeNode('onclick').value)));
else
+++$(tmpobject).attr('onclick',tmp.nextSibling.attributes[0].value);+//this+even+supposes+index|code-block|syntax|javascript|343536|无论如何，只是为了让人们对可以做的事情有一个总体的想法，因为我相信很多人都偶然发现了这种恼人的事情。|343537|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

BTW, without JQuery this could also be done, but obviously it's pretty ugly as it only considers IE/non-IE:

<pre><code>if(isie)
 tmpobject.setAttribute('onclick',(new Function(tmp.nextSibling.getAttributeNode('onclick').value)));
else
 $(tmpobject).attr('onclick',tmp.nextSibling.attributes[0].value); //this even supposes index
</code></pre>

Anyway, just so that people have an overall idea of what can be done, as I'm sure many have stumbled upon this annoyance.

I'd like to change the value of the <code>onclick</code> 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 <code>onclick</code> attribute in HTML.) Here are a few things I tried:

<ul>
<li>Using jQuery <code>attr("onclick", js)</code> doesn't work with both Firefox and IE6/7.</li>
<li>Using <code>setAttribute("onclick", js)</code> works with Firefox and IE8, but not IE6/7.</li>
<li>Using <code>onclick = function() { return eval(js); }</code> doesn't work because you are not allowed to use <code>return</code> is code passed to <code>eval()</code>.</li>
</ul>

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.

<pre><code>&lt;html&gt;
 &lt;head&gt;
 &lt;script type="text/javascript"
 src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"&gt;&lt;/script&gt;
 &lt;script type="text/javascript"&gt;
 $(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);
 });
 &lt;/script&gt;
 &lt;/head&gt;
 &lt;body&gt;
 &lt;a href="http://www.google.com/" id="anchor" onclick="alert('A'); return false;"&gt;Click&lt;/a&gt;
 &lt;/body&gt;
&lt;/html&gt;
</code></pre>

JavaScript: changing the value of onclick with or without jQuery

服务器

jQuery

我想更改锚点上onclick属性的值。我想将它设置为一个包含JavaScript的新字符串。(该字符串由服务器提供给客户端JavaScript代码，它可以包含您可以放入onclick属性中的任何内容。)以下是我尝试过的一些方法：使用jQuery attr("onclick", js)的不适用于火狐和IE6/7。使用se...

问JavaScript:使用或不使用jQuery更改onclick的值
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JavaScript:使用或不使用jQuery更改onclick的值EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JavaScript:使用或不使用jQuery更改onclick的值
EN