清除按钮清空textarea但我不能重新填充它

时间:2013-10-24 22:06:53

标签: javascript jquery html button clear

我正在尝试创建一个

的网页
  1. 如果用户点击文字框中显示的字词
  2. 如果单击两次单词,则不会再次出现在框中
  3. 用户可以使用按钮清除该框
  4. 用户可以将内容发送到另一个页面
  5. 我的代码如下:

    <div id="parent">
        <!-- get the clicked word and add it to textarea-->
        <script type="text/javascript">
            $("#parent").delegate("span", "mousedown", function() {
                if ( $("#thediv").text().indexOf($(this).text()) <0 )
                {
                    $("#thediv").append($(this).text());// get old div contents and add clicked word
                    $("#thediv").append(' ');// also add a space
                    $("#thediv").html(); //print to div
                };   
           })
        </script>
    
        <!-- clickable words  -->    
        <span>One </span><span>Two</span><span>Three</span>
    
        <!-- the form --> 
        <form action="/test/index6.html" method="get">
            <textarea id="thediv" name="thediv"></textarea><br>
            <input type="submit" >
        </form>
    
        <!-- Clear button  -->     
        <input type="button" id="clear" value="Clear" />
        <script type="text/javascript">
            $('#clear').click(function (){
                $("#thediv").val('');
            });
        </script>
    </div>
    

    它工作正常,点击鼠标即可存储单击的单词(如果它位于标签之间。对于每个单击的单词,我检查文本区域是否已包含它,如果不是,我添加它。

    我的问题在于清除按钮。它会清除文本区域但是我无法再添加任何单词,就好像这部分代码停止工作一样。

    有什么建议吗?

1 个答案:

答案 0 :(得分:1)

尝试将$("#thediv").val('');更改为$("#thediv").html('');,与this jsfiddle一样。