javascript onchange 函数不起作用

Question

我在 haml View 中有一个下拉菜单:

= collection_select(:vehicle_part, :service, Inventory.all, :id, :title, {}, {id: 'line_item', class: 'line_item', :onchange => "{my_function(this);}"})

它会生成以下 HTML(对于那些不了解 haml 的人)

<select class="line_item" id="line_item" name="vehicle_part[service]" onchange="{my_function(this);}">
  <option value="1">first line</option>
  <option value="2">second line</option>
</select>

我的 JavaScript 看起来像:

尝试1

$(document).ready(function () {
    $( ".line_item" ).change(function() {
        console.log( "Handler for .change() called." );
    });
});

尝试2

$(document).ready(function () {
    my_function(value) {
        console.log( "Handler for .change() called." );
    });
});

我不知道为什么这不起作用，因为一切看起来都很好。

我做错了什么有什么帮助吗？

忘记提及:这可以与 bootstrap-modal 一起使用吗？我正在 bootstrap-modal 工作

解决方案我做错的只是没有刷新我的页面，我真是太傻了，只是认为通过加载模式会刷新页面。

Answer 1

这是一个有效的代码:

html:

<select class="line_item" id="line_item" name="vehicle_part"><option value="1">first line</option><option value="2">second line</option></select>

javascript:

$(document).ready(function () {
    $( ".line_item" ).change(function() {
        alert("abc");
    });
});

请注意，我已经更改了 console.log 的警报，这样更容易调试。

这是JSFiddle链接。

需要改变的事情:

• 从 HTML 代码中删除 onchange 事件
• 在 HTML 代码中添加了 line_item 类。
• 在 JavaScript 中添加了警报，以便更轻松地在 JSFiddle 中调试代码。