Question

我正在尝试在更改选择框时触发一个函数。我正在尝试内联脚本和内部脚本。请检查我的代码......

inline script:

    <script>
    function show()
    {
        alert("show");
    }
    </script>
    <select name="registerAs" id="registerAs" onchange="show()">
	    <option value="register as">register as</option>
		<option value="doctor">doctor</option>
		<option value="patient">patient</option>
		<option value="pharmacy">pharmacy</option>
	</select>

internal script

    <script>
    window.onload = function()
    {
        document.getElementById("registerAs").onchange = function()
        {
            alert("show");
        }
    }
    </script>
    <select name="registerAs" id="registerAs">
	    <option value="register as">register as</option>
		<option value="doctor">doctor</option>
		<option value="patient">patient</option>
		<option value="pharmacy">pharmacy</option>
	</select>

我无法理解为什么这不起作用。

Answer 1

适用于我，但使用内联事件处理程序是不好的做法，导致代码很少，难以管理的代码 - 它与eval一样糟糕。请认真考虑使用JavaScript附加您的活动，例如：https://developer.mozilla.org/en/DOM/element.addEventListener。

如果您遇到问题，请尝试这样的方法，将Javascript保留在Javascript中，将HTML保留在HTML中 - 单独显示内容：

// in a separate .js file:
document.querySelector("#registerAs").addEventListener('change', () => {
  alert("show");
});

<select name="registerAs" id="registerAs">
<option value="register as">register as</option>
<option value="doctor">doctor</option>
<option value="patient">patient</option>
<option value="pharmacy">pharmacy</option>
</select>

当你使用inline或on * - 属性时，你每个事件只限制一个处理程序 - 你之前要覆盖该元素上的任何属性。

onchange在内部和内联脚本中都不起作用。为什么？

1 个答案: