javascript - 从文本框的列表项中选择部分文本

Question

我有以下文本框代码：

<label>Enter the doctor id</label>
         <input type="text" autocomplete="on" name="dr_id" id="user_id" class="user_name" >

我想在文本框中添加“-”之后的字符串。例如：对于 Dr. Prashant Salunke-dr.salunke 。我必须在文本框中只有 dr.salunke，因为它在“-”之后。我写了一些代码如下：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript">

$(document).ready(function(){


    $(".slidingDiv").hide();
    $(".show_hide").show();

    $('.show_hide').click(function(){
    $(".slidingDiv").slideToggle();
    });

   $('#list li').click(function()
   {
    var arr=$(this).text().split('-');
    $('#user_id').val($(arr[1]).text());

   });

});

</script>

 <a href="#" class="show_hide">List of doctors</a><br />
    <div class="slidingDiv">
<ul id="list">
    <li style="cursor:hand;">Dr.Prashant Salunke - dr.salunke.</li>
    <li style="cursor:hand;">Dr.Kalam - dr.apj</li>
    <li style="cursor:hand;">Dr.Manmohan Singh - dr.economics</li>
</ul>
    </div>


</div>

但它不起作用。请提出一些解决方案。

Answer 1

该arr[1]值不需要转换为 jQuery 对象。您可以按原样使用它来设置 的val()，input尽管使用$.trim删除前导/尾随空格可能会有所帮助：

$('#list li').click(function() {
    var arr = $(this).text().split('-');
    $('#user_id').val($.trim(arr[1]));
});

Answer 2

你可以这样做：

$('#list li').click(function () {
    var arr = $(this).text().split('-');
    $('#user_id').val(arr[1]);

    // arr    returns   ["Dr.Prashant Salunke ", " dr.salunke."] 
    // arr[1] returns   dr.salunke. 
});

由于arr[1]已经有了文本值，因此无需从中$(arr[1]).text()获取文本值。