如果選擇第一個選擇的某個值，請更改第二個選擇的名稱

-1

我目前有一個包含2個選擇下拉列表的表單。如果用戶從第一個選擇（實體類型）中選擇選項3，我需要第二個「名稱」從「狀態ID」更改爲「狀態」。如果選擇第一個選擇的某個值，請更改第二個選擇的名稱

<form id="home-form" name="home-form" method="get" > 
 

 
    <select id="entitytype" class="select required" > 
 
    <option value="">Select Your Entity Type</option> 
 
    <option value="test1">1</option> 
 
    <option value="test1">2</option> 
 
    <option value="test3">3</option> 
 
    </select> 
 
    
 
    <select id="stateID" name="stateID" class="select required" > 
 
    <option value="">Select Your State</option> 
 
    <option value="AL">Alabama</option> 
 
    <option value="AK">Alaska</option> 
 
    <option value="AZ">Arizona</option> 
 
    </select> 
 
    
 
<button type="submit" class="btn-form">GET STARTED</button> 
 
    
 
</form>

來源

2017-05-24 Clyde

當它選擇的 – LebCit

可能重複[使用jQuery基於第一選擇列表選項更改第二選擇列表]，你可以使用'.prop（）'和切換name屬性（https：//開頭計算器.com/questions/10570904/use-jquery-to-change-a-second-select-list-based-first-select-list-option） –

不完全，我不想調整選項第二個選擇的值，但第二個選擇的名稱。 – Clyde

動態更改表單元素的name屬性聽起來並不像一個非常好的事情在做。我建議看看你的服務器端邏輯 - 假設它是某種模型綁定引起這種要求。

如果您沒有其他選擇，則可以將change事件處理程序掛接到第一個select，該處理程序將讀取所選值並更改第二個所需屬性。試試這個：

$('#entitytype').change(function() { 
 
    var value = $(this).val(); 
 
    $('#stateID').prop('name', function() { 
 
    return value == 'test3' ? 'state' : 'stateID'; 
 
    }); 
 
    
 
    console.log($('#stateID').prop('name')); // only to show the effect in this demo 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="home-form" name="home-form" method="get"> 
 
    <select id="entitytype" class="select required"> 
 
    <option value="">Select Your Entity Type</option> 
 
    <option value="test1">1</option> 
 
    <option value="test1">2</option> 
 
    <option value="test3">3</option> 
 
    </select> 
 

 
    <select id="stateID" name="stateID" class="select required"> 
 
    <option value="">Select Your State</option> 
 
    <option value="AL">Alabama</option> 
 
    <option value="AK">Alaska</option> 
 
    <option value="AZ">Arizona</option> 
 
    </select> 
 

 
    <button type="submit" class="btn-form">GET STARTED</button> 
 
</form>

來源

2017-05-24 22:06:09

設置一個監聽器要等到選擇輸入被改變，那麼如果它被設置爲「TEST3」，然後更新與屬性的方法名稱。

$('#entitytype').change(function() { 
    var name = $(this).val() === 'test3' ? 'state' : 'stateID'; 
    $('#stateID').attr('name', name); 
});

並且一定要改回來，如果它改變了第三個選項。另外，如果您將此腳本放在表單的HTML之前，請確保將其包裝在文檔就緒功能中。

$(document).ready(function() { 
    // Code here 
});

來源

2017-05-24 22:11:02 jkys

如果選擇第一個選擇的某個值，請更改第二個選擇的名稱

回答

相關問題