Question

我想做的是，如果该选项包含此特定文本，它将显示另一个div，但现在我不能仅将选择了值的选项作为目标。

如果该选项已“选中”，我想定位该选项

<option class="wcumcs-option" value="USD" selected>$ USD</option>

Check this image

 if ($('select option:selected:contains("php")')) {
      $('.price.total-rental-price').show();
      $('h3.booking_cost').show();
    }
    if ($('select option:selected:contains("USD")')) {
      $('.price.total-rental-price-usd').show();
      $('h3.booking_cost_usd').show();
    }
    if ($('select option:selected:contains("GBP")')) {
      $('.price.total-rental-price-gbp').show();
      $('h3.booking_cost_gbp').show();
    }
    if ($('select option:selected:contains("CNY")')) {
      $('.price.total-rental-price-cny').show();
      $('h3.booking_cost_cny').show();

    }
    if ($('select option:selected:contains("SGD")')) {
      $('.price.total-rental-price-sgd').show();
      $('h3.booking_cost_sgd').show();

    }
    if ($('select option:selected:contains("CAD")')) {
      $('.price.total-rental-price-cad').show();
      $('h3.booking_cost_cad').show();

    }
    if ($('select option:selected:contains("AUD")')) {
      $('.price.total-rental-price-aud').show();
      $('h3.booking_cost_aud').show();
    }

Answer 1

$(document).ready(function(){

    var selected_value = $("#selector :selected").val(); 
  
    if(selected_value == "INR"){
       $(".show_select_value p span").html(selected_value);
        $(".show_select_value").show();
    }
    else{
       $(".show_select_value p span").html("");
        $(".show_select_value").hide();
    }

})

.show_select_value{
  display: none;
  border:1px solid #000;
  padding: 15px;
  margin: 20px 0 0 0
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="selector">
  <option value="USD">USD</option>
  <option value="INR" selected="selected">INR</option>
  <option value="CAD">CAD</option>
</select>

<div class="show_select_value">
  <p>Selected value is: <span></span></p>
</div>

希望这会有所帮助

Answer 2

不确定这是您想要的东西，然后在其中进行选择。

var yourSelectId = document.getElementById("yourselectid");


var option= yourSelectId.options[yourSelectId.selectedIndex].value;

if(option == "USD"){
   $('.price.total-rental-price-usd').show();
   $('h3.booking_cost_usd').show();
}

Answer 3

我可能建议为此下拉列表使用与更改事件关联的事件侦听器。然后根据选择的选项，执行您想要的任务。

document.getElementById("currencyDropDown").addEventListener('change',
  (event) => {
    switch (event.target.value) {
      case "USD":
        console.log({
          Message: "You have selected USD"
        });
        break;
      case "GBP":
        console.log({
          Message: "You have selected GBP"
        });
        break;
      case "NZD":
        console.log({
          Message: "You have selected NZD"
        });
        break;
    }
  }
);

JsFiddle：https://jsfiddle.net/m58kyf0g/

如何定位已选择值的选择选项

3 个答案: