Question

只是想知道是否有办法检查选择框下拉列表的值是否与页面加载时的原始值匹配（当使用selected = "yes"设置值时）？

我想我可以使用PHP将原始值创建为JavaScript变量并检查它们，但是有一些选择框，我试图让代码尽可能简洁！

Answer 1

这根本不太难。这将跟踪页面上每个select的值：

$(document).ready(function() {
    $("select").each(function() {
        var originalValue = $(this).val();

        $(this).change(function() {
            if ($(this).val() != originalValue)
                $(this).addClass('value-has-changed-since-page-loaded');
            else
                $(this).removeClass('value-has-changed-since-page-loaded');
        });
    });
});

这会将新的类value-has-changed-since-page-loaded（可能是您重命名为更相关的内容）应用于任何选择框，其值与页面加载时的值不同。

只要您有兴趣看到值已更改，就可以利用该类。

Answer 2

$(document).ready(function() {
    var initialSelectValue = $('#yourselect').val();

    // call this function when you want to check the value
    // returns true if value match, false otherwise
    function checkSelectValue() {
        return $('#yourselect').val() === initialSelectValue;
    }
});

PS。您应该使用selected="selected"而不是selected="yes"。

Answer 3

在页面加载时，创建一个数组，其中每个选择框的初始值都按名称索引：

var select_values = [];

$(document).ready(function() {
    $("select").each(function() {
        select_values[$(this).attr('name')] = $(this).val();
    });
});

稍后当您需要检查值是否已更改时：

function has_select_changed(name) {
    return $("select[name="+name+"]").val() != select_values[name];
}

Answer 4

首先，一个片段：

$('select').each( 
  function(){ 
    if( this.options[ this.selectedIndex ].getAttribute('selected') === null ){
          alert( this.name +' has changed!') 
    }
});

现在解释：

假设selectElement是对＆lt; select /＆gt;的引用element您可以使用

检查选择了哪个选项

selectElement.selectedIndex

获取＆lt;选项/＆gt;当前选择的元素，使用

selectElement.options[ selectElement.selectedIndex ]

现在，当你知道选择了哪个选项元素时，你可以看出这个元素是否具有selected ='selected'属性（如源代码中那样，它不会改变 - 这与.selected属性不同DOM节点，对于当前选定的选项元素为true，并在更改选择时更改）

使用JavaScript或jQuery，如何检查选择框是否与原始值匹配？

4 个答案: