6

我想防止在满足特定条件而不禁用选择元素的情况下更改选择。

4

7 回答 7

7

试试这个：JSBin 演示

<select id="mySelect" data-value="" onfocus="this.setAttribute('data-value', this.value);" 
onchange="this.value = this.getAttribute('data-value');">
于 2012-12-24T10:07:34.983 回答
2

当您不想在您的条件下更改选择时，您可以保留last选择的更改值和它。reassign

现场演示

html

<select id="select">
   <option>1</option>
   <option>2</option>
   <option>3</option>
</select>​

Javascript

preval = $('#select').val();
$('#select').change(function() {
    if ($(this).val() == "2") {  $(this).val(preval); return;}
    preval = ($(this).val();    
});​
于 2012-12-24T09:56:29.600 回答
2 
old_value = $('#select :selected').val();
$('#select').change(function() {
  if($(this).val() == 'option 3') {//your specific condition
     $('#select').val(old_value);
  } else {
    old_value = $('#select :selected').val();
  }
});

演示

于 2012-12-24T09:49:14.353 回答
1

你想做什么的例子

var select = $('select'), option = $('whatyouwanttotest');
if (option.val() == 'value') {
  select.attr('disabled', 'disabled');
} else {
  select.removeAttr('disabled');
}
于 2012-12-24T09:54:12.527 回答
0 
(function () {
    var previousIndex;

    $("select[name=test]").focus(function () {
        // Store the current value on focus, before it changes
        previousIndex= this.selectedIndex;
    }).change(function(e) {
        e.target.selectedIndex = previousIndex;
    });
})();​

这是一个尝试的小提琴：http: //jsfiddle.net/x5PKf/700/

于 2012-12-24T10:00:46.700 回答
0

您可以在SELECT元素上动态应用一些选择规则。

例如，您可以将选择限制为当前选择的值，或者您可以限制用户可以选择的选项。

查看现场演示：

HTML

<select id="selectElement">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
    <option value="4">Option 4</option>
    <option value="5">Option 5</option>
    <option value="6">Option 6</option>
    <option value="7">Option 7</option>
</select>

<select id="restrictOptions">
    <option value="">Do not restrict options</option>
    <option value="3,4,6,7">Restrict options to 1, 2 and 5</option>
    <option value="1,2,7">Restrict options to 3 to 6</option>
    <option value="other">Restrict to currently selected option</option>
</select>

JavaScript

function applySelectRule(selector, rule) {
    var el = $(selector);
    var currentValue = el.val();
    var valuesRestricted = (rule == 'other' ? '' : rule).split(RegExp('\\s*,\\s*'));

    el.unbind('change.restrictedRule')  // remove old binding
      .bind('change.restrictedRule', function() {
          if (rule == 'other') {
               if (el.val() != currentValue) el.val(currentValue);
          }              
    }).find('option').each(function() {
        var opt = $(this);
        if (valuesRestricted.indexOf(opt.val()) == -1) {
            opt.removeAttr('disabled');
        } else {
            opt.attr('disabled', true);
        }
    }).end().find('option[value="'+currentValue+'"]:disabled').each(function() {
        // set first value that is not disabled
        el.val(el.find('option:not(disabled)').text());
    });
};

$('#restrictOptions').change(function() {
    applySelectRule('#selectElement', $(this).val());
});​

代码应该足够清晰，但是如果您需要，我可以澄清它。

于 2012-12-24T10:46:07.143 回答
0

试试这个：http: //jsfiddle.net/Csamn/

function selectIt() {
    $('#select option:eq(0)').attr('selected', 'selected');
}
$('#select').change(function() {
    if ($(this).val() != "1") {
        setTimeout(function() {
            selectIt();
        }, 0);
    }

});

它永远不会让您选择 1 以外的选项。Checkout the fiddle.

于 2012-12-24T10:22:38.897 回答