Question

我有一个变量列表和一个字段列表，其中可能包含文本输入或textareas。我想点击变量名称并将其自动附加到最后一个焦点输入/ textarea字段中的内容的末尾（假设最后一个焦点是那些字段之一）。

这是一个JsFiddle，它说明了我尝试做的事情：http://jsfiddle.net/fyUn6/

HTML：

Field 1: <input type="text" name="field[1]" /><br/>
Field 2: <input type="text" name="field[2]" /><br/>
Field 3: <input type="text" name="field[3]" /><br/>
Field 4: <textarea name="field[4]"></textarea><br/>
Field 5: <textarea name="field[5]"></textarea><br/>
<br/>
<span class="variable">NAME</span><br/>
<span class="variable">AGE</span><br/>
<span class="variable">WEIGHT</span><br/>

JavaScript的：

jQuery(document).ready(function() {
    var prevFocus;

    jQuery("input[type=text], textarea").focus(function() {
        prevFocus = jQuery(this);
    });

    jQuery(".variable").click(function() {
        if(typeof prevFocus !== "undefined") {
            prevFocus.html(prevFocus.html()+jQuery(this).html());
        }
        else {
            alert("Select where you want to insert this variable first.");
        }
    });
});

请注意，当您单击textarea（不先输入）然后是变量时，它会正确填充。但是，它对输入字段不起作用，当你开始手动输入textarea然后单击一个变量时，它也不起作用。

这里发生了什么？为什么它只在这一条件下工作？我确定我错过了一些简单的东西，但我还是jQuery的新手并且错过了一些更好的观点。

Answer 1

试试这个 Fiddle Demo

prevFocus是一个文字输入， val() 是您需要的，而不是 html() 。

if(typeof prevFocus !== "undefined") {
    prevFocus.val(prevFocus.val()+jQuery(this).html());
}

.val（）方法主要用于获取表单元素的值，例如input，select和textarea
.html（）用于获取任何元素的内容

Answer 2

请试试FIDDLE 您的jquery代码稍有变化

jQuery(document).ready(function() {
        var prevFocus;

        jQuery("input[type=text], textarea").focus(function() {
            prevFocus = jQuery(this);
        });



        jQuery(".variable").click(function() {
            if(typeof prevFocus !== "undefined") {
                prevFocus.val(prevFocus.html()+jQuery(this).html());
            }
            else {
                alert("Select where you want to insert this variable first.");
            }
        });
});

jQuery：最后聚焦的输入字段没有按预期填充

2 个答案: