dojo 1.8:在查询后将条件应用于结果

Question

我不知道如何将条件应用于查询后的结果。这段代码以前被要求过，但我想增强它

require(["dojo/parser", "dojo/ready", "dojo/query", "dojo/on", "dijit/form/Select", "dojo/domReady!"], function (parser, ready, query, on, Select) {
ready(function () {
    parser.parse();

    var select_Card = new Select({
        name: 'select_PCBA',
        options: [{
            label: "<span id='NotinUse'><b>&nbsp&nbsp&nbsp. . .</b></span>",
            value: "",
            selected: true
        }, {
            label: "<span id='NotinUse'><b>&nbsp&nbspMk7ABC Card</b></span>",
            value: "testdata1970_05"
        }, {
            label: "<span id='inUse'><b>&nbsp&nbspMk7CBC Card</b></span>",
            value: "testdata1970_10"
        }, {
            label: "<span id='NotinUse'><b>&nbsp&nbspMk10DC Card</b></span>",
            value: "testdata2060_03"
        }, {
            label: "<span id='NotinUse'><b>&nbsp&nbspMk6BC Card</b></span>",
            value: "dbProdigy"
        }, {
            label: "<span id='NotinUse'><b>&nbsp&nbspMk6NBC Card</b></span>",
            value: "dbProdigy_MK6N"
        }, ],
        style: {
            width: '150px'
        }
    }, "select_Card");

    select_Card.startup();


    on(select_Card, 'change', function(newValue)
    {
        if query('#inUse')
        {
            alert('Item selected is '+ newValue);
        }
        else
        {
            alert('Please select the only highlighted card');                           
        }
    });
    });
});

或者，为了您的方便，请访问my jsfiddle。

或者你有更好的办法吗？

请告知，谢谢

克莱门特

Answer 1

我已经更新了你的jsFiddle：http://jsfiddle.net/fredfortier/q5LC7/11/。它有一些地方出了问题。我清理了“就绪”的东西，让它运行起来。

我认为代码结构中有一些问题，您可能想要清理一下。但是我不想对你的代码做太多的修改，所以我只是让它正常工作。重要的一点是，您多次使用相同的ids。我改成上课了。此外，查询函数的作用域不是闭包，它将在dom中搜索。因此，事件处理程序中的条件永远不会起作用。

再说一次，我不认为这段代码非常完美，可以用不同的方式处理，但在这里它可以工作，而不需要对您已有的代码进行重大更改：

require(["dojo/parser", "dojo/ready", "dojo/query", "dojo/on", "dijit/form/Select", "dojo/_base/array", "dojo/domReady!"], function (parser, ready, query, on, Select, array) {

    console.debug('rendering...');
    var select_Card = new Select({
        name: 'select_PCBA',
        options: [{
            label: "<span class='NotinUse'><b>&nbsp&nbsp&nbsp. . .</b></span>",
            value: "",
            selected: true
        }, {
            label: "<span class='NotinUse'><b>&nbsp&nbspMk7ABC Card</b></span>",
            value: "testdata1970_05"
        }, {
            label: "<span class='inUse'><b>&nbsp&nbspMk7CBC Card</b></span>",
            value: "testdata1970_10"
        }, {
            label: "<span class='NotinUse'><b>&nbsp&nbspMk10DC Card</b></span>",
            value: "testdata2060_03"
        }, {
            label: "<span class='NotinUse'><b>&nbsp&nbspMk6BC Card</b></span>",
            value: "dbProdigy"
        }, {
            label: "<span class='NotinUse'><b>&nbsp&nbspMk6NBC Card</b></span>",
            value: "dbProdigy_MK6N"
        }, ],
        style: {
            width: '150px'
        }
    }, "select_Card");

    select_Card.startup();

    on(select_Card, 'change', function(newValue)
    {
        console.debug('got selected value:', newValue, 'from options:', select_Card.options);
        array.forEach(select_Card.options, function(option) {
            if (option.value == newValue) {
                  console.debug('found selected option in the list: ', option);
                  if (option.label.indexOf("'inUse'") != -1) {
                        alert('Item selected is '+ newValue)
                  } else {
                        alert('Please select the only highlighted card');
                  }
            }
        });
    });

})；

Answer 2

首先，你的代码甚至不能运行，你的on()函数是杂乱无章的，只是把它粘贴到编辑器中就会显示错误。其次，使用多个完全相同的id是一个非常非常糟糕的主意，使用类来代替。

on(select_Card, 'change', function(newValue)
{
  var display = this.get('displayedValue');
  if(display.indexOf("class='inUse'") !== -1 || newValue === 'testdata1970_10'){
    alert('correct stuff')
  }else{
    alert('error');
  }
});

http://jsfiddle.net/73F2t/

下面是一个更正过的小提琴，or子句表示您可以使用任何一个条件进行过滤，并且它应该可以工作