如何使用jQuery隐藏元素?

时间:2016-08-08 04:13:08

标签: javascript jquery html hide

HTML

$(document).on("click", "#bkash-radio", function() {
    console.log('test');
    $("#trx_id").attr("type", "text");
});

$(document).on("blur", "#bkash-radio", function() {
    console.log('test');
    $("#trx_id").attr("type", "hidden");
});

jQuery函数:

to_csv

我试图在选择第二个单选选项时显示文本框id = trx_id,但是当取消选择它时,我希望隐藏文本框。我怎么能这样做?

1 个答案:

答案 0 :(得分:2)

  1. 定位[name='payment_options']无线电
  2. 点击change活动,看看this.value==="2"
  3. 分别操纵prop 类型
  4. $(document).on("change", "[name='payment_options']", function() {
      $("#trx_id").prop("type", this.value==="2" ? "text" : "hidden");
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="btn-group" data-toggle="buttons">
      <label class="btn btn-default active">
        <input type="radio" name="payment_options" value=1 autocomplete="off" checked>Cash on Delivery
      </label>
      <label class="btn btn-default" id="bkash-radio">
        <input type="radio" name="payment_options" value=2 autocomplete="off">bKash
      </label>
    </div>
    
    <input type="hidden" name="trx_id" id="trx_id" class="form-control" placeholder="Enter Transaction ID"/>