Question

请帮我解决这个问题。

我有以下html：

<form>    
  <select class="form-control" id="order_bid_ord_type">
    <option value="market">market</option>
    <option selected="selected" value="limit">limit</option>
  </select>
  <div id="bid_mo_container">
     Hello world   
  </div>
</form>

我有以下javascript

$('#order_bid_ord_type').on('change', function() {
  if (this.value === 'market') {
    $('#bid_mo_container').show();
  } else if (this.value === 'limit') {
    $('#bid_mo_container').hide();
  }
});

以下CSS：

#order_bid_ord_type{
  display: none;
}

我的JS小提琴在这里

http://jsfiddle.net/D46Zb/59/

这就是我想要做的事情：当我从组合框中选择市场时，我希望显示hello world文本。当我选择限制时，我希望它消失

现在，当我更改选择时没有任何反应。你能帮我弄清楚代码的问题在哪里吗？

Answer 1

您的代码中没有错误。您忘记包含jquery。

下面是工作小提琴。

＆＃13;

$('#order_bid_ord_type').on('change', function() {
  if (this.value === 'market') {
    $('#bid_mo_container').show();
  } else if (this.value === 'limit') {
    $('#bid_mo_container').hide();
  }
});

＆＃13;

#bid_mo_container
{
	display: none;
}

＆＃13;

<script src="https://code.jquery.com/jquery-1.12.0.js"></script>
<form>    
  <select class="form-control" id="order_bid_ord_type">
    <option value="market">market</option>
    <option selected="selected" value="limit">limit</option>
  </select>
  <div id="bid_mo_container">
     Hello world   
  </div>
</form>

＆＃13;

https://jsfiddle.net/Kroonal/ybw8Lv06/

Answer 2

我要改变

this.value === 'market'

到

$(this).val() == 'market'

与JS中的其他选项相同

使用javascript隐藏/显示<div>并选择

2 个答案: