2013-05-13 8 views
6

私はブートストラップ・フレームワークの一部である以下のコードを使用しています。ブートストラップ・ドロップダウンの使用 - Jqueryによるフォーカス入力

私の目標は、<a>name</a>をクリックして入力をフォーカスすることです。これは、Jqueryのクリック/フォーカス機能を使用して行います。私はすでにaリンクのdata-toggle="dropdown"属性について知っています。私は本当に経験がありません。誰かが私のためにいくつかの助けを得たことを願っています!

<html> 
<body> 
<li class="dropdown"> 
<a class="dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="#"><i class="icon-user"></i> name </a> 
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"> 
<li> 
<form ...>          
<input type="text" id="4711" /> 
</form> 
</li> 
</ul> 
</li> 
</body> 
</html> 



<script> 
$('#dLabel').click(function() { 
    $('#4711').focus(); 
}); 
</script> 
+1

HTMLコードが間違っている、あなたはない –

答えて

5

あなたは、文書準備ハンドラにコードを置く必要があります。

SEE DEMO

$(function() { 
    $('#dLabel').click(function() { 
     setTimeout(function(){$('#login').focus();},0); 
    }); 
    $('.dropdown input[type=text]').click(function(e){ 
     e.stopPropagation(); 
    }); 
}); 
+0

前にbodyタグを閉じた後のHTMLタグを閉じる必要があります。 –

+0

あなたの迅速な対応に感謝します!基本的にはその作業、はい。問題はブートストラップのドロップダウンで理解できます!ブートストラップjsライブラリをfsfiddleに追加しました。 plzはそれに多くを取る。私の希望は、おそらくブートストラップのドロップダウン機能を聞いて、フォーカス機能を呼び出すことでした。しかし、再び、私は本当にexpieriencedではないので、誰かが助けることができる場合、私は非常に嬉しいです! – user1946431

+0

ここにjsfiddleリンクがあります:http://jsfiddle.net/uNrmS/3/ – user1946431

0

回避策ソリューションを{ブートストラップのために、あなたは簡単な回避策としてタイムアウトを使用することができます}要素の代わりにfor属性を持つlabel要素を使用しています。あなたは私はあなたが話しているのか理解していないとして、あなたの問題を説明するためにjsfiddle使用することができます

... 
    <li class="dropdown"> 
    <label for="4711" class="dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown"> 
    <i class="icon-user"></i> name </a> 
    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel"> 
     <li> 
     <form ...>          
     <input type="text" id="4711" /> 
     </form> 
     </li> 
    </ul> 
    </li> 
... 
関連する問題