页面上的jquery onchange事件重新加载不起作用

我正在使用jquery根据所选下拉列表禁用其他下拉菜单。以下是该代码。页面上的jquery onchange事件重新加载不起作用

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

因此，在页面重新加载禁用的字段后，再次启用，但选择是在那里禁用这些字段。

请帮忙!!

感谢 SANKET

来源

2017-05-05 Sanky

你介意编辑您的帖子的选择，所以水平滚动条会消失？ – reporter

现在好了 – Sanky

@reporter你认为这看起来好多了吗？ –

你应该写你的条件为的Page_Load功能也得到页面刷新的影响：

$(document).on("pageload",function(){ 
     //add here logic related to get currently selected value from dropdown and make 
    other tags disable as per your requirement 
    });

让我知道，如果你面对任何与此问题。

来源

2017-05-05 11:14:26

在页面加载时，您需要检查下拉列表的值，与下拉列表更改时的操作相同。

这是因为尽管您的服务器端代码保留了所选下拉列表的值，但它并不会保留您在客户端设置的控件的禁用状态。网页本质上是无状态的，当页面刷新时，任何你没有明确保存的改变都会被销毁。

您可以轻松地重新使用现有的代码来做到这一点：

jQuery(function() { 
setEnabledDisabled(jQuery('select').val()); //runs at page load 

jQuery('select').change(function() { 
    setEnabledDisabled(jQuery(this).val()); 
}); 

//re-usable function to implement the logic 
function setEnabledDisabled(val); 
    if(val == "A"){ 
    jQuery(document.getElementById('dataForm:listView:filterId:field10value1')) 
      .attr('disabled','disabled'); 
    jQuery(document.getElementById('dataForm:listView:filterId:field4value1')) 
     .removeAttr('disabled'); 
    jQuery(document.getElementById('dataForm:listView:filterId:field6value1')) 
     .removeAttr('disabled'); 
    } else if(val == "R"){ 
    jQuery(document.getElementById('dataForm:listView:filterId:field10value1')) 
     .removeAttr('disabled'); 
    jQuery(document.getElementById('dataForm:listView:filterId:field4value1')) 
     .attr('disabled','disabled'); 
    jQuery(document.getElementById('dataForm:listView:filterId:field6value1')) 
     .attr('disabled','disabled'); 
    }else{ 
    jQuery(document.getElementById('dataForm:listView:filterId:field10value1')) 
     .removeAttr('disabled'); 
    jQuery(document.getElementById('dataForm:listView:filterId:field4value1')) 
     .removeAttr('disabled'); 
    jQuery(document.getElementById('dataForm:listView:filterId:field6value1')) 
     .removeAttr('disabled'); 
    } 
} 
});

附：作为一个旁注，我强烈建议升级你的jQuery版本 - 1.3在写作时已经超过8年（2009年发布）。自那时以来，出现了很多错误修复和增强功能，以及支持您可能想要利用的更新浏览器和功能的更改。 1.12.4是2016年5月发布的1.x分支的最新版本。如果您不再需要支持较早版本的IE，则可以移动到2.x分支，这将导致较小的下载，但是没有引入兼容性问题。 3.x做出了一些突破性的改变，需要更彻底的测试。

来源

2017-05-05 11:18:50 ADyson

做到这一点 - 在页面加载即在文件准备好，功能run_your_rules（$ VAL）将被用无论是默认

$(document).ready(function(){ 
    var $this = $('select'); 
    var $val=$this.val(); 
    run_your_rules($val); 

    $this.on('change',function(e) { 
     run_your_rules($(this).val()); 
    }); 

    function run_your_rules($val){ 
    if($val==="A"){ 
     console.log("disable A"); 
    }else if($val==="B"){ 
     console.log("disable B"); 
    } 
    } 

})

来源

2017-05-05 11:44:49 user1428716

页面上的jquery onchange事件重新加载不起作用

回答

相关问题