頁面上的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事件重新加載不起作用

回答

相關問題