Question

有一个组合框，如果我点击一个选项，该值将复制到一个文本框。我想将这些选项值一个写在另一个之下。

这是javascript代码：

$('#subcategory1').on('change', function() {
    $('#properties').val($('#properties').val() + '' + $(this).val() + ' ');
})

我尝试使用'+ keyCode == 13'，但它不起作用。救救我！

Answer 1

如果要将子类别元素的值添加到textarea，这是一个示例。您可以使用换行符\n代替HTML元素<br>

$('#subcategory1').on('change', function() {
    $('#properties').val($('#properties').val() + "\n" + $(this).val());
});

HTML：

<textarea name="properties" id="properties"></textarea>

Answer 2

所以有两种方法可以实现这一目标。

第一种方法是使用ul - 列表标记，并使用点击的值附加li - 子标记。

但是如果你想使用文本框，你必须用新的值分隔当前值并在它们之间添加\n返回。

<强> HTML

Select your products: 

<select id="products">
    <option>iPhone</option>
    <option>PC</option>
    <option>Xbox One</option>
    <option>Stack Underflow</option>
    <option>Someone your like</option>
</select>

<br>
<br>

Your selected products:

<br>
<br>

<ul id="selected_products"></ul>

<textarea id="selected_products_textarea"></textarea>

javascript - 一个统治所有人的脚本

var ul = document.getElementById('selected_products');
var textarea = document.getElementById('selected_products_textarea')

document.getElementById('products').onchange = function() {

    // UL List Part
    var li = document.createElement('li');
    li.innerHTML = this.value;

    ul.appendChild(li);

    // Textarea Part
    textarea.innerHTML = textarea.innerHTML.length == 0 ? this.value : textarea.innerHTML + '\n' + this.value;

}

JSFiddle：http://jsfiddle.net/kuwc6kte/1/

现在，您可以更进一步，从选择列表中删除所选项目，或检查当前所选项目是否已在列表中，然后继续...您的脚本中的任何要求。

修改

刚刚看到你使用jQuery，这里是一个jQuery解决方案，具有相同的 HTML ：

<强>的jQuery

var ul = $('#selected_products'); var textarea = $('#selected_products_textarea'); $('#products').on( 'change', function() { // UL List Part var li = $('</li>'); li.html( $(this).val() ); ul.append(li); // Textarea Part textarea.html( textarea.html().length == 0 ? $(this).val() : textarea.html() + '\n' + $(this).val() ); });

JSFiddle：http://jsfiddle.net/kuwc6kte/3/

单击，按Enter键进入文本框

2 个答案: