jquery更改功能

我有一个xhtml页面，包含标题和详细信息部分。标题包含过滤器，详细信息包括根据所选过滤器从数据库获取数据。我的要求是，我的过滤器包含一个带有2个值的下拉菜单，假设“A”和“B”，所以根据选择我想禁用其他一些下拉菜单。jquery更改功能

我已经添加下面的代码片段： -

<script type="text/javascript"> 
       $(function() { 
        $('select').change(function() { 
        alert($(this).val()); 
        if($(this).val() == "A"){ 
         $(document.getElementById('dataForm:listView:filterId:field10value1')).prop("disabled", true); 
         $(document.getElementById('dataForm:listView:filterId:field4value1')).prop("disabled", false); 
         $(document.getElementById('dataForm:listView:filterId:field6value1')).prop("disabled", false); 
        }else if($(this).val() == "R"){ 
         $(document.getElementById('dataForm:listView:filterId:field10value1')).prop("disabled", false); 
         $(document.getElementById('dataForm:listView:filterId:field4value1')).prop("disabled", true); 
         $(document.getElementById('dataForm:listView:filterId:field6value1')).prop("disabled", true); 
        }else{ 
         $(document.getElementById('dataForm:listView:filterId:field10value1')).prop("disabled", false); 
         $(document.getElementById('dataForm:listView:filterId:field4value1')).prop("disabled", false); 
         $(document.getElementById('dataForm:listView:filterId:field6value1')).prop("disabled", false); 
        } 
        }) 
       }) 
      </script>

这工作得很好，第一次。但是当我点击应用获取数据时，下次无法使用。

请帮忙!!

来源

2017-04-25 Sanky

'适用于获取数据'是做什么的？看起来它打破了你的变化事件。 – wannadream

“$（'select'）。on（”change“，”select“，function（）{...}）”你可以这样试试。你也可以检查浏览器控制台，看看是否有任何jscript错误。 – ReadyFreddy

在控制台中没有错误 – Sanky

如果您想要一个完整的jQuery解决方案，如下所示。

工作实施例：https://jsfiddle.net/Twisty/hfqc4cz5/

HTML

<div class="ui-widget"> 
    <select> 
    <option></option> 
    <option>A</option> 
    <option>R</option> 
    </select> 
</div> 
<div class="ui-widget"> 
    <input id="dataForm:listView:filterId:field10value1" /> 
    <input id="dataForm:listView:filterId:field4value1" /> 
    <input id="dataForm:listView:filterId:field6value1" /> 
</div>

的JavaScript

$(function() { 
    $('select').change(function() { 
    var selected = $(this).val(); 
    var field10 = $('#dataForm\\:listView\\:filterId\\:field10value1'), 
     field04 = $('#dataForm\\:listView\\:filterId\\:field4value1'), 
     field06 = $('#dataForm\\:listView\\:filterId\\:field6value1'); 
    switch (selected) { 
     case "A": 
     console.log("A Selected."); 
     field10.prop("disabled", true); 
     field04.prop("disabled", false); 
     field06.prop("disabled", false); 
     break; 
     case "R": 
     console.log("R Selected."); 
     field10.prop("disabled", false); 
     field04.prop("disabled", true); 
     field06.prop("disabled", true); 
     break; 
     default: 
     console.log("'' Selected."); 
     field10.prop("disabled", false); 
     field04.prop("disabled", false); 
     field06.prop("disabled", false); 
    } 
    }); 
});

https://api.jquery.com/category/selectors/来自：

要使用任何元字符（如!"#$%&'()*+,./:;<=>[email protected][\]^{|}~）作为名称的文字部分，必须使用两个反斜杠进行转义：\\。例如，id =“foo.bar”的元素可以使用选择器$("#foo\\.bar")。

我也使用了switch()结构。它做同样的事情，但我更喜欢它，因为我可以在未来发展它。

您还会看到我使用jQuery选择器与原始JavaScript方法。我还将jQuery对象推入自己的变量中以便于使用。

来源

2017-04-25 16:17:09 Twisty

非常感谢:) – Sanky

它工作正常..现在我还有一个问题..我有一个错误弹出窗口后来应用过滤器.. – Sanky

会出现什么错误？ – Twisty

jquery更改功能

回答

相关问题