如何.focus（）元素，當它可見與.fadetoggle（）在jQuery中？

我運行jQuery代碼下方的軌道：如何.focus（）元素，當它可見與.fadetoggle（）在jQuery中？

$(document).ready(function(){ 
    $(".add-new-team-button").on("click", function(){ 
     $(".new-team-form").fadeToggle("fast", function(){ 
      $(".new-team-form").focus(); 
     }); 
    }); 
});

上的按鈕在我的網頁上的DIV中的點擊，它應該顯示或隱藏包含表單一個div（。新-team-形式）。但是，當div可見/顯示時，我希望瀏覽器將焦點放在div上，因爲您必須向下滾動一下才能看到它。淡入淡出功能工作得很好。我只是不能把它專注於窗體div。我關於使focus（）動作起作用的理論產生了上面的代碼，我很感激修復它的幫助，因爲它顯然是錯誤的。

來源

2015-09-17 kpaul

該元素是「輸入」嗎？ – RRK

你能做小提琴嗎？ http://jsfiddle.net/ –

我想你的代碼，它看起來不錯 [JSBin（http://jsbin.com/rudacujiwa/edit?html,js,output） – GMartigny

.focus()不滾動，.scrollTop(position)確實滾動。 JSFiddle with solution。編輯：如果在輸入字段上調用，焦點將滾動。儘管scrollTop是一個更通用的解決方案。

來源

2015-09-17 09:59:17 leroydev

如果你想使用集中你的div必須在其上具有tabindex屬性，如：

<div class="new-team-form" tabindex="-1">Add data</div>

或者您可以使用scrollTop方法，如：

$(window).scrollTop($('.new-team-form').offset().top);

演示：http://jsfiddle.net/wygs46r5/

來源

2015-09-17 10:04:02

BTW，-1允許集中以編程方式在元素上，你仍然無法用TAB等鍵來關注它。只是一個筆記。 – starikovs

找到第一個表單元素並專注於此。使用.find(':input:visible').first().focus()。

$(document).ready(function(){ 
    $(".add-new-team-button").on("click", function(){ 
     $(".new-team-form").fadeToggle("fast", function(){ 
      $(this).find(':input:visible').first().focus(); 
     }); 
    }); 
});

來源

2015-09-17 10:18:30 RRK

如何.focus（）元素，當它可見與.fadetoggle（）在jQuery中？

回答

相關問題