1

私はウェブページを作成しようとしています

  1. ユーザーが単語をクリックすると、テキスト ボックスに表示されます
  2. 単語が 2 回クリックされた場合、ボックスに再び表示されることはありません
  3. ユーザーはボタンでボックスをクリアできます
  4. ユーザーはコンテンツを別のページに送信できます

私のコードは次のとおりです。

<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>

正常に動作し、クリックされた単語が保存されます (タグの間に配置されている場合)。クリックされた単語ごとに、テキスト領域に既に含まれているかどうかを確認し、含まれていない場合は追加します。

私の問題はクリアボタンにあります。テキスト領域はクリアされますが、コードのこの部分が機能しなくなったかのように、それ以上単語を追加できません。

何かアドバイス？

4

1 に答える 1

1

この jsfiddleのように、 に変更$("#thediv").val('');してみてください。$("#thediv").html('');

于 2013-10-24T22:11:09.817 に答える