使用jQuery更改下拉值的更改標籤的值使用jQuery

我試圖使用jQuery更改下拉值中的更改標籤的值，但其不起作用。請幫我解決這個問題。使用jQuery更改下拉值的更改標籤的值使用jQuery

<select id="myselect"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
</select> 
<br/> 
<label id="label"></label> 
<br/>

$("label").val("150.000.000"); 
$(("#myselect").val()).on('change', function() { 
    if ($("#myselect").val() == '1') { 
     $("#label").val("150.000.000"); 
    } else { 
     $("#label").val("350.000.000"); 
    } 
});

來源

2016-01-21 user317461

您連接到change事件選擇不正確，則需要提供該元素的id作爲一個字符串，元素本身的不是值。另外，label元素沒有必要使用text()來更改它們的值，並且您可以在change處理程序中使用this來引用select元素。試試這個：

$("label").text("150.000.000"); 
 
$("#myselect").on('change', function() { 
 
    if ($(this).val() == '1') { 
 
    $("#label").text("150.000.000"); 
 
    } else { 
 
    $("#label").text("350.000.000"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="myselect"> 
 
    <option value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
</select> 
 

 
<br/> 
 
<label id="label"></label> 
 
<br/>

你甚至可以縮短JS代碼到這一點：

$("label").text("150.000.000"); 
$("#myselect").on('change', function() { 
    $("#label").text(function() { 
     return $(this).val() == '1' ? "150.000.000" : "350.000.000"; 
    }) 
});

來源

2016-01-21 07:59:25

兄弟仍然沒有工作:( – user317461

它絕對應該，因爲你可以從看snippet。檢查控制檯是否存在代碼中的錯誤 –

@RoryMcCrossan，只是一個問題，是否有區別'$（this）.val（）'和'$（「option：selected」，this）.val（）'。我看到後者[這裏]（http://stackoverflow.com/questions/1643227/get-selected-text-from-a-drop-down-list-select-box-using-jquery），並假設它更受歡迎。 – Rajesh

您可以保存所有的值在數組中，並可以用價值來計算的價值指數被選中。

下面的代碼片段描繪了相同：

var data = ["150.000.000", "350.000.000", "550.000.000", "750.000.000"]; 
 

 
$("#myselect").on("change", function() { 
 
    var selectedVal = $("option:selected",this).val(); 
 
    var newValue = data[parseInt(selectedVal)-1]; 
 
    $("#label").text(newValue); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<select id="myselect"> 
 
    <option value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
</select> 
 

 
<br/> 
 
<label id="label"></label> 
 
<br/>

來源

2016-01-21 08:08:47 Rajesh

試試這個代碼：

$(document).ready(function() { 
    $("label").text("150.000.000"); 
    $("#myselect").on('change', function() { 
    if ($("#myselect").text() == '1') { 

     $("#label").text("150.000.000"); 

    } else { 

     $("#label").text("350.000.000"); 
    } 
    }); 
});

來源

2016-01-21 08:11:18 Sumanta736

您是否測試過$（「＃myselect」）。text（）'實際返回的內容？ –

是的，它返回從開始到結束的所有文本。 – Sumanta736

確切地說，那很不幸，它爲什麼不起作用。 –

使用jQuery更改下拉值的更改標籤的值使用jQuery

回答

相關問題