在href属性中使用“ javascript：”更改按钮的值

Question

Why doesn't this work in a browser?

<input type="button" id="x">
<a href="javascript:document.getElementById('x').value='something';">Click</a>

Yes, I know that I can use onClick to call a function and put my code there, but is there a way to use 'javascript:' with the href attribute to do simple javascript functions like changing a value?

Answer 1

Assignment "returns" the value assigned. Returning any kind of value from a javascript: link indicates to the browser that it should replace the document with that value.

Usually you might see javascript:void(stuff goes here) to suppress the return value.

You already seem to be aware of why you shouldn't do this, though. onClick event handler is a step in the right direction, but really it should be attached externally.

Answer 2

Yes, that should work and as you know onclick is another easy approach to do it;

However if you still want to it with href you may try this - (this might look unwillingly big :)

<input type="button" id="x">
<a href="javascript:(function(){document.getElementById('x').value='something';})();">Click</a>