jquery选择多个onchange选择和取消选择选项(在ipad上)

时间:2012-11-01 17:33:01

标签: jquery ipad events select option

我在iPad上选择和取消选择选项时遇到问题。

“按颜色购买”是一个没有值的选项,因此选择此选项后,它将显示所有项目。选择任何其他选项后,它将显示该类别中的项目。

我想要的只是:

  • 当您点击.othervalue选项时,“按颜色购买”(.firstvalue)应取消选择,并且应选择单击的选项
  • 当您单击.firstvalue选项时,它应该被选中,并且应该取消选择所有其他选项(.othervalue)

以下是我的尝试:

$(document).ready(function() {
    $('select').change(function() {
        var $this = $(this);
        if($("option.firstvalue").is(":selected")) {                
            $this.find('option:first').attr('selected', false);
        } else {                               
            $this.find('option:gt(0)').attr('selected', false);
        }
    });
});

**完整的代码已开启:http://jsfiddle.net/GNpzq/ **

我想我应该使用$('select')。change()因为iPad正确触发了那个事件,但我不确定。

有人可以帮我解决这个问题吗?

谢谢!

编辑: 这里是解决问题的代码,也许有人会使用。

$(function() {
    // select and deselect default OPTION for filters
    var firstSelectState = new Array;
    var optionsArray = new Array;

    $('select').change(function() {
        var id = this.id;
        if (!id) {
            id = Math.round(Math.random()*99999);
            this.id = id;
        }
        if (typeof(firstSelectState[id])=="undefined") firstSelectState[id] = this.options[0].selected;
        var tmpOptionsArray = new Array();
        for (var i = 1; i<this.options.length; i++) {
            tmpOptionsArray[i] = this.options[i].selected;
        }

        if (typeof(optionsArray[id])=="undefined") {
            optionsArray[id] = tmpOptionsArray;
        }

        var firstSelected = (firstSelectState[id]!=this.options[0].selected);
        var otherSelected = false;
        for (var i = 1; i<this.options.length; i++) {
            if (optionsArray[id][i]!=tmpOptionsArray[i]) {
                otherSelected = true;
                break;
            }
        }

        optionsArray[id] = tmpOptionsArray;
        if (firstSelected && !otherSelected) {
            for (var i = 1; i<this.options.length; i++) {
                this.options[i].selected = false;
            }
        } else {
            this.options[0].selected = false;
            firstSelectState[id] = false;
        }


    });
});

1 个答案:

答案 0 :(得分:1)

目前您正在阻止任何选择,您的条件是说如果选择了第一个选项取消选择它,如果选择其他选项也取消选择它们,请尝试以下操作:

$('select').change(function() {
    if (this.selectedIndex === 0) {
        $('option:gt(0)', this).prop('selected', false);
    } else {
        $('option:first', this).prop('selected', false);
    }
});

http://jsfiddle.net/LynCV/