Question

我在HTML中有一个带有以下下拉选择菜单的表单：

<div class="input-field col s4">
    <select id="disposition" required>
        <option value="No_Sale" id="noSale">No Sale</option>
        <option value="Sale" id="yeahSale">Sale</option>
        <option value="Unreachable" id="noContact">Unreachable</option>
        <option value="Call_Back" id="callBack">Call Back</option>
    </select>
    <label>Disposition</label>
</div>

上面的处理代码段应该影响是否禁用其他表单元素。但是，我似乎无法获得改变用户输入的价值。

以下是jQuery的javascript：

$(document).on('change', 'select', function(){
    console.log(disposition);
    console.log($("#yeahSale").selected == true);

    if ($("#yeahSale").selected == true) {
        $("#fund").removeAttr('disabled');
    }
});

对于$("#disposition").val()和$("#yeahSale").selected，console.log都会返回

“No_Sale”

单击表单元素并选择

时，

和false

“出售。”

我尝试的第一件事是：

    if (disposition == "Sale")

我也尝试过：

var disposition = $("#disposition").find(":selected").text();

我一直在搜索堆栈交换和谷歌搜索近一个小时的答案，但到目前为止我没有任何成功。如果我完全错过了一个已经解决的现存问题，我表示歉意。

感谢您的帮助！

Answer 1

$("#disposition").val()为您提供所选选项的值。

所以你只想根据你选择的值来设置条件。

＆＃13;

$(document).on('change', '#disposition', function(){
    
    /* 
        If you want to put condition based on 
        option with specific id is selected or not  then
        
        if($("#yeahSale").is(':selected')) { 
           
        }
   */

    if ($("#disposition").val() == 'Sale') {
        // Do here what you want to do
        // $("#fund").removeAttr('disabled');
        console.log("Sale Selected");
    } else {
        console.log("Selected Option is: "+ $("#disposition").val());
    }
  
    //Get Id attr of selected option
    console.log("Id of selected option is: " + $(this).find('option:selected').attr('id'));
   
    // Check weather option with specific Id is selected or not:
    console.log($("#yeahSale").is(':selected'));
   
  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="input-field col s4">
    <select id="disposition" required>
        <option value="No_Sale" id="noSale">No Sale</option>
        <option value="Sale" id="yeahSale">Sale</option>
        <option value="Unreachable" id="noContact">Unreachable</option>
        <option value="Call_Back" id="callBack">Call Back</option>
    </select>
    <label>Disposition</label>
</div>

＆＃13;

如果您想获取所选选项的id属性，可以使用此

$(this).find('option:selected').attr('id')

如果你想看看带有ID的选项yeahSale被选中或不是这样：

$("#yeahSale").is(':selected')

Answer 2

var disposition = $('#disposition').val();
$('#disposition').change(function() {
    disposition = $(this).val();
    console.log(disposition);
}

Answer 3

 <div class="input-field col s4">
 <select id="disposition">
    <option value="No_Sale">No Sale</option>
    <option value="Sale">Sale</option>
    <option value="Unreachable">Unreachable</option>
    <option value="Call_Back">Call Back</option>
  </select>
   <label>Disposition</label>
  </div>
<script>
  $(document).on('change', function(){
   alert($("#disposition").val());
  console.log($("#yeahSale").selected == true);

   if ($("#yeahSale").selected == true) {
    $("#fund").removeAttr('disabled');
   }
  });

  tested and found it working

Answer 4

您需要的只是disposition.value和onchange事件。

以下脚本将确认用户输入，并在进行新选择时返回更新的disposition.value：

var disposition = document.getElementById('disposition');
disposition.addEventListener('change', function(){console.log(disposition.value);}, false);

<select id="disposition" required>
<option value="No_Sale">No Sale</option>
<option value="Sale">Sale</option>
<option value="Unreachable">Unreachable</option>
<option value="Call_Back">Call Back</option>
</select>

选项值不随用户选择而改变

4 个答案: