我试图在选择框中放置一个 onchange 事件,但由于某些奇怪的原因它不起作用。这是我的选择框:
<%= f.label :Tipe, "Tipe:", class: "control-label col-md-1" %>
<div class="col-md-3">
<%= f.select :Tipe, ['Mont','Vol'],onChange: "myFunction()", class: "form-control"%>
</div>
这是我的 JavaScript:
<script>
function myFunction() {
alert( "Handler" );
}
</script>
最佳答案
内联 JavaScript 被认为是不好的做法,因为这样的原因很难调试。也许你应该尝试:
在您的页面 js 文件或脚本标记中 - 以任何一个为例:
var myFunction = function(){
// do whatever
}
$('.form-control').on('change', function(){
myFunction();
});
“on”事件监听器允许将任何事件绑定(bind)到元素类/id。更好的是,绑定(bind)到父元素的 id,您可以确保事件与可能由 ajax 请求不时刷新的子事件保持连接。例如
# parent html.erb file
<div id="container">
<%= render 'form' %>
</div>
# inside form partial
<%= f.label :Tipe, "Tipe:", class: "control-label col-md-1" %>
<div class="col-md-3">
<%= f.select :Tipe,
['Mont','Vol'],
onChange: "myFunction()",
class: "form-control"
%>
</div>
# then in JS
$('#container').on('change', '.form-control', function(){
//do something
});
否则,我认为你的函数现在不起作用,因为你缺少分号:
"onChange: "myFunction();"
如果没有,请检查“onChange”/“change”绑定(bind)。什么构成“改变”?如果要在某些用户交互后执行操作,则最好使用“点击”。
希望这有帮助。
关于javascript - 将 onChange 事件放在选择框中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42281917/