jQuery動態更改引導標簽文本

Question

我正在使用來自此提琴的代碼http://jsfiddle.net/kcpma/18/我試圖實現的是根據從按鈕中選擇的值來顯示或取消隱藏引導標簽，標簽中的文本應更改，但僅適用於像文本這樣的html輸入形式，這看起來不錯，但是我想使用bootstrap標簽使外觀看起來像過濾器標簽。

我的劇本

<script>
$('#demolist li').on('click', function(){
    var val=$(this).text();
    $('#datebox').val($(this).text());

    if(val=="A"){ // if certain filter is selected the label should appear
    $('#filter').show();
      $('#filter').val("AaA");
      }else{ // else the tag shouldn't be visible
      $('#filter').hide();
      }
});

</script> 

使用文本輸入的實際html

<br /> <br />     
<div class="container">
    <div class="col-sm-8">
        <div class="input-group">                                            

           <input type="TextBox" ID="datebox" Class="form-control" ></input>

           <div class="input-group-btn">

                <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
                    <span class="caret"></span>
                </button>

                <ul id="demolist" class="dropdown-menu">
                    <li><a>A</a></li>
                    <li><a>B</a></li>
                    <li><a>C</a></li>
                </ul>

            </div>

        </div>
    </div>
    <br>
     <h4 ><span class="label label-primary"  >&times;</span></h4>
     <p><input type="text" class="form-control" ID="filter"  style="width:100px" disabled></p>

</div>

我試過的html但它不起作用1）

<h4 ><span class="label label-primary" ID="filter">some filter</span></h4>

2）

<h4  ID="filter"><span class="label label-primary">some filter</span></h4>

有什么提示/想法嗎？

Answer 1

$.val僅適用於input元素（包括select ）。 如果要設置文本，則可以執行以下操作：

<h4 ><span class="label label-primary" ID="filter">some filter</span></h4>

和

$('#filter').html("AaA");

要么

$('#filter').text("AaA");

http://jsfiddle.net/kcpma/261/