根據其他選擇列表值顯示隱藏選擇列表

以下代碼根據父級選擇列表的值顯示一個（多個隱藏的）子選擇列表。該腳本檢查是否選擇了任何值（在父級選擇列表中），如果是，則顯示相應的子選擇列表。但是，如果用戶選擇父級選擇列表的值，發佈表單，獲取子選擇列表未命中輸入的消息，並且（很可能）在瀏覽器中按下返回按鈕，父級選擇列表仍然有一個值（我猜是瀏覽器默認），並且子選擇列表被隱藏，這很可能會混淆用戶。根據其他選擇列表值顯示隱藏選擇列表

這怎麼解決？

的Javascript：

$('#parent-list').live("change",function() { 
     var value = $(this).find('option:selected').val(); 
     $("#child-list-"+value).slideDown(200).siblings().hide(); 
     return false; 
    });

HTML：

<select id="parent-list" name="parent"> 
    <option value="1">1</option> 
    ... 
</select> 
<select id="child-list-1 style="display:hidden"> 
    <option value="a">a</option> 
</select> 
<select id="child-list-2 style...

來源

2012-07-15 Joseph

我認爲這是一個普遍的問題，據我所知沒有完美的解決方案。

您需要找到一些方法來檢查頁面是否處於無效狀態，例如刷新定時器（setInterval），它可以檢查任何依賴關係並在必要時重新呈現。

如果用戶在POST後按下後退按鈕，他會收到警告（至少在某些瀏覽器中）。雖然你不能相信用戶意識到這個問題...

編輯：此外，爲什麼用戶重定向到錯誤消息的另一頁？如果發生錯誤，您可以將其重定向回窗體，或者最好在提交表單之前執行驗證客戶端？

來源

2012-07-16 02:53:23

當文檔準備好我通常選擇在每一頁上加載相應的選項，無論是通過代碼生成的HTML或JavaScript的。

來源

2012-07-15 23:55:08

但是選項很重要，所以我不想冒用戶發送驗證表單而不主動選擇選項的風險。 – Joseph 2012-07-16 00:07:25

然後，您需要在第一次加載頁面時選擇空的第一個選項。但如果用戶提交後再次顯示錶單，請重新選擇用戶選擇的選項。 – 2012-07-16 00:14:36

但這並不能解決它聽到按下後退按鈕不會觸發。至少在我的測試中。編輯：對不起，工作cours，在我的空代碼有一個錯誤編輯2：猜我會去那，只是煩惱的用戶重新填寫一個字段，而不是填寫字段只顯示.. – Joseph 2012-07-16 00:18:00

根據其他選擇列表值顯示隱藏選擇列表

回答

相關問題