javascript - jQuery单击未将值适本地附加到文本框

我正在尝试将单词库wordBank_Headings中的一个单词附加到文本框#textBox。

我的jQuery之所以有效，是因为我已经用其他元素（例如$("#textBox").click(function (event) {）测试了click函数，然后log("testing : " + $(this).attr('word'));输出“ testing：undefined”。

当用户单击单词时，它将被发送到文本框：



我在Chrome中检查了HTML。我看到单词被适当地包装在spans中。



我不确定为什么点击这些词不会起作用。

这是我的代码：

$(document).ready(function() {
    //initially append words to word bank
    $.getJSON("php/Quests.php", { "_questNum" : questNum},
        function(wordsArray) {
            $.each(wordsArray, function(key, value) {
                $(".wordBank_Words").append("<span class='bankword' word='" + key + "' ><b>" + key + "</b>: " + value + "</span><br/>");
            }
        );
    });

    /*If user clicks word in word bank, word is added to text box*/
    $(".bankword").click(function (event) {
        log("testing : " + $(this).attr('word'));
        $('#textBox').val($('#textBox').val() + " " + $(this).attr('word'));
        //hide word from word bank
        $(this).hide();
    });


    /*If User removes word from text box, add it back to word bank*/
    $('#textBox').on('change', function(){
        var words = $(this).val().split(' ');
        $('.bankword').each(function(){
           if( words.indexOf( $(this).attr('word') ) !== -1 ){
               $(this).hide();
           }
           else {
               $(this).show();
           }
        });
    });
});

最佳答案

我认为您是在创建文档后创建一个span元素。因此，您应该为on事件尝试click。您可以尝试如下操作：

$(document).on('click',".bankword",function (event) {
   log("testing : " + $(this).attr('word'));
   $('#textBox').val($('#textBox').val() + " " + $(this).attr('word'));
   //hide word from word bank
   $(this).hide();
});

关于javascript - jQuery单击未将值适本地附加到文本框，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21519442/