1

これは私が気づいた非常に奇妙なバグです。イベントを使用して、.focus()トリガー時にdivを別のdivに追加します。コードは問題なく、正常に動作しますが、タブを切り替えて (別のサイトを開くことを意味します)、イベントを使用したサイトに戻ると.focus、結果が重複します。コードを見たい場合は教えてください。ただし、これは単純なイベント呼び出しであり、特別なことは何もありません。コードは次のとおりです。

<div id="song">
   <input type="text" id="post_title" name="title" value="Artist - Song" /><br />               
</div>

   var songSuggestion = '<div id="titleSuggest" style="width:270px; background:#37819d; color:white; margin:0 auto; ">Try this!</div>';

$('#post_title').focus(function(event){ 
    $(this).parent().append(songSuggestion);
    });

$('#post_title').blur(function(){
    $(this).parent().find('#titleSuggest').remove();
});

ここに画像の説明を入力 編集: これはクロムでのみ発生し、Firefox では発生しません!

4

1 に答える 1

0

わかりましたので、あなたが構築しようとしているものを理解しようと最善を尽くしました。もう少し詳しく試してみたい場合は、私がお手伝いします。これがJSFiddleで、コードはすぐ下にあります。

div を追加する代わりに、特定の div を非表示にして、フォーカス関数が起動されたらデータを明らかにすることをお勧めします。

HTML

​​​​​​​​​​​​​​​&lt;form>
   <input type="text" name="firstname" />
   <div class="append-div">Try This Out !</div>             

   <input type="text" name="lastname" />        
   <div class="append-div">Try This Out !</div>
</form>

CSS

html { margin: 10px; }

input { 
  border: 1px solid #000; 
  padding: 3px 7px; 
  width: 200px; 
  margin-top: 10px; 
  display: block; 
}

.append-div { 
  width: 200px; 
  padding: 3px 7px; 
  height: 15px; 
  background-color: #999; 
  border: 1px solid #2d2d2d; 
  margin-bottom: 20px; 
  display: none; 
  color: #000; 
}

JQuery

$("input").focus(function() {

   if ($(this).next(".append-div").is(":hidden")) {

      $(this).next(".append-div").show();

   } else {
   }

});

ご不明な点がございましたら、お気軽にお問い合わせください。

于 2012-04-24T21:41:39.467 に答える