在文本框下方顯示選定的多個值

-1

我想顯示文本框的選定值並在文本框下方顯示選定的值。在文本框下方顯示選定的多個值

下面的文本框可以接受多個值，可以通過單擊值上的x符號來刪除它。這就像我們在發送消息時在Facebook上添加收件人的方式一樣。

一旦用戶開始在文本框中輸入內容，就會有建議可供選擇。

這種方式的值被添加到文本框中。

現在我想在文本框下面的div中顯示選定的多個值。通過我寫的javascript代碼，它只顯示一個值。但我想顯示可以選中的多個值，並且值從文本框中移除後應該消失。請糾正我犯錯的地方。

function takeVal(val) 
     { 
    var str=''; 
    <? 
     $query = "select * from product"; 
     $sql = mysql_query($query); 
     while($rs = mysql_fetch_object($sql)) 
     { 
    ?> 
     if('<?php echo $rs->id;?>' == val) 
     { 

     //str += '<?php echo $rs->name;?>'; 
      document.getElementById('selectedResult').innerHTML = "The selected number is - " + "<?php echo $rs->name;?>"; 
     } 

    <? 
     } 
    ?> 

     }

HTML

<input type="text" id="interestedin" name="" class="box2 validate[required]"OnChange="takeVal(this.value);"/> 
<div id='selectedResult'></div>

來源

2011-10-12 Bala.C

因爲我得到的值是唯一的ID。我寫了查詢，採取相應的名稱 –

你有沒有嘗試過任何答案嗎？如果是這樣的話：他們回答你的問題/解決你的問題？ – PPvG

這聽起來像是一種非常粗糙的方式來實現自動完成（沒有冒犯）。你有沒有考慮過使用一個插件爲其中的一個JS框架？例如，默認情況下，jQuery UI提供了一個相當健壯的自動完成插件：jQuery UI AutoComplete。

利用這一點，你的問題是很容易解決：

<script type="text/javascript"> 
    $(function() { 
     var products = [ 
      <?php // PHP begins here 
       $query = "select * from product"; 
       $sql = mysql_query($query); 
       while($rs = mysql_fetch_object($sql)) { 
        echo '"', $rs->name, '",'; 
       } // PHP ends here 
      ?> 
     ]; 
     $("#interestedin").autocomplete({ 
      source: products, 
      select: function(event, ui) { 
       $('#selectedResult').text(ui.item.value); 
      } 
     }); 
    }); 
</script> 
<input type="text" id="interestedin" class="box2 validate[required]" /> 
<div id="selectedResult"></div>

來源

2011-10-12 13:21:27 PPvG

下面是一個工作示例：http://jsfiddle.net/Cnu9M/ – PPvG

對不起PPvG。我目前無法嘗試，因爲我在工作場所塞滿了其他作品。我會在今晚嘗試，並儘快更新結果。非常感謝你的及時迴應和幫助。對此，我真的非常感激。 –

的$ RS-> ID是一個數組，使用任何一個通過它或foreach語句循環。

來源

2011-10-12 12:41:40

你能告訴我上面的代碼究竟該怎麼做？ –

在文本框下方顯示選定的多個值

回答

相關問題