javascript - 避免在第一次更改后更改选择标签

Question

假设我有以下选择标签:

<select id="select_val">
<option>This is first</option>
<option>This is second</option>
</select>

现在我想要的是，我希望选择存在，但我们不应该能够进一步更改它。 例如，如果他选择选项二，即这是第二个，他不能进一步更改它。我怎样才能使用 jquery 做到这一点？提前致谢

Answer 1

$('#select_val').change(function(){
    $(this).prop('disabled', true);
})

评论后编辑:

如果您想传递所选值并保持选择禁用，有多种解决方案。现在这取决于您是否使用 AJAX 或者只是简单的表单提交。 对于 AJAX 你可以这样做:

$('form').submit(functiom(){
    $('#select_val').prop('disabled', false);
    var data = $(this).serialize();
    $('#select_val').prop('disabled', true);

    $.ajax({
        url : 'some_url',
        data : data
        // ... other parameters here
    });
});

如果是简单的表单提交，那么我不会将禁用切换为关闭，因为用户可以通过按转义键停止发送表单，然后更改选择。然后另一种方法可以创建隐藏输入，例如:

$('form').submit(functiom(){
    var select = $('#select_val');
    $(this).append('<input type="hidden" name="'+ select[0].name +'" value="'+ select.val() +'">');
});