0

最初のクリックでのみtextareaからテキストを削除するこのコードがあります。次の2番目のtextareaタグを作成するまでは、問題なく機能します。

<textarea id="textarea2" onfocus="checkOnFocus(this);" onblur="resetInitialText(this);">Your second message</textarea>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <script type="text/javascript">
      var flag = false;
  
      function setInitialText() {
        var textarea = document.getElementById('textarea');
        if (textarea.value == "") {
          textarea.value = text;
        }
      }
  
      function checkOnFocus(textarea) {
        if (!flag) textarea.value = "";
        flag = true;
      }
  
      function resetInitialText(textarea) {
        if (textarea.value == "") {
          textarea.value = text;
          flag = false;
        }
      }
    </script>
    </head>
    <body onload="setInitialText();">
      <textarea id="textarea" onfocus="checkOnFocus(this);" onblur="resetInitialText(this);">Your first message</textarea>
      <textarea id="textarea2" onfocus="checkOnFocus(this);" onblur="resetInitialText(this);">Your second message</textarea>
    </body>
</html>
4

4 に答える 4

1

あなたの答えから、jqueryに問題がないことがわかると、非常に基本的なプレースホルダーソリューションとして次のことを試すことができます。

$('[data-placeholder]').each(function () {
  var placeholder = $(this).data('placeholder');

  $(this).val(placeholder).on({
    focus: function () {
      $(this).val(function (_, value) {
        return value === placeholder ? '' : value;
      });
    },

    blur: function () {
      $(this).val(function (_, value) {
        return value === '' ? placeholder : value;
      });
    }
  });
});

と：

<textarea data-placeholder="Your first message"></textarea>
<textarea data-placeholder="Your second message"></textarea>

http://jsbin.com/iyobiy/1/

于 2013-01-07T10:10:43.580 に答える
1

私はついに私が尋ねたことを行う方法を見つけました：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title></title>  
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>
<script type='text/javascript'>//<![CDATA[ 

$(function() {
    $("textarea").focus(function(event) {

          // Erase text from inside textarea
        $(this).text("");

          // Disable text erase
        $(this).unbind(event);
    });
});
//]]>  

</script>


</head>
<body>
  <textarea rows="5" cols="30">Enter text here.</textarea>
  <textarea rows="5" cols="30">Enter text here.</textarea>
</body>
</html>
于 2013-01-07T09:54:39.143 に答える
0

（グローバル）フラグが1つとテキストエリアが2つしかないため、2番目の呼び出しが行われるまでに、フラグはすでにtrueに設定されています。配列またはディクショナリタイプの構造を使用して、ジェネリック実装を作成することを検討してください。1つのオプションは、グローバルスコープで配列を使用することです。

var textareasAlreadyHit = new Array();

その後、毎回：

function checkOnFocus(textarea)

フラグをチェックする代わりに、配列にテキストエリアのIDが含まれているかどうかをチェックします。もしそうなら、何もしません。そうでない場合は、textareaからテキストを削除し、textareaのIDを配列に追加します。

于 2013-01-07T09:16:08.517 に答える
0 
function checkOnFocus(textarea){
if(!flag)
textarea.value="";
flag=false;
}

function resetInitialText(textarea){
if(textarea.value==""){
textarea.value='text';
flag=false;
}

2つの変更がここにあります

1> checkOnFocus（）メソッド

flag=false;

2> resetInitialText（）メソッド

textarea.value='text';// make your own string to replace
于 2013-01-07T09:20:04.967 に答える