顯示輸入字段與jquery

我想顯示輸入到div的所有值。我想我的最終輸出看起來像這樣：顯示輸入字段與jquery

startmsg middlemsg *NAME-FROM-SELECT-MENU* endmsg *TEXT-FROM-INPUT-FIELD*

這裏是我的代碼：

<select id="names"> 
    <option value=""></option> 
    <option value="Alex">Alex</option> 
    <option value="Jeff">Jeff</option> 
    <option value="Amy">Amy</option> 
    <option value="Kate">Kate</option> 
</select> 
<input id="message" type="text" /> 
<input id="clear" type="submit" value="Clear" /> 
<div id="display"></div> 


$('#names')('#message').keyup(function() { 
    $('#display').append('starmsg').append('middlemsg').text($(this).val().append('endmsg')); 
});

來源

2011-05-21 sarsar

有一個問題在這裏？ – 2011-05-21 08:22:45

我看你的代碼是不是太遙遠。您需要多重選擇器，並且可能還需要change事件而不是keyup。您還需要調用append jQuery的對象，而不是字符串：

$('#names, #message').change(function() { 
    $('#display') 
     .text('startmsg ') 
     .append(' middlemsg ') 
     .append($('#names').val()) 
     .append(' endmsg ') 
     .append($('#message').val()); 
});

來源

2011-05-21 08:22:57 lonesomeday

感謝那正是我想要完成的。唯一的事情是'startmsg'和'middlemsg'不出現http://jsfiddle.net/yvTNc/5/ – sarsar 2011-05-21 08:29:45

@sarsar查看更新。 'text'覆蓋現有的內容; 'append'增加了它。 – lonesomeday 2011-05-21 08:36:01

謝謝。如何通過點擊按鈕同時清除#display，#message和#names？ – sarsar 2011-05-21 09:01:35

由於您使用jQuery的，我建議在輸入和。每個標籤的選擇

請參閱以下鏈接瞭解更多信息，它完全符合您的需求。

jQuery .each

來源

2011-05-21 08:18:21

這是你所追求的http://jsfiddle.net/DUytH/

function update(){ 
    $('#display') 
     .text('start ' + 
       $('#message').val() + 
       ' end ' + 
       $('#names').val()); 
} 
$('#message').keyup(update); 
$('#names').change(update);

來源

2011-05-21 08:31:30

顯示輸入字段與jquery

回答

相關問題