Question

我正在尝试将输入中的所有值显示为div。我希望我的最终输出看起来像这样：

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'));
});

Answer 1

由于您使用的是jQuery，我建议.each输入和选择标签

有关详细信息，请参阅以下链接，它完全符合您的要求。

jQuery .each

Answer 2

我认为你的代码并不太遥远。您需要多重选择器，可能还需要change事件而不是keyup。您还需要在jQuery对象上调用append，而不是字符串：

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

Answer 3

这就是http://jsfiddle.net/DUytH/

之后的情况

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

用jquery显示输入字段

3 个答案: