重點點擊？

有沒有簡單的方法來觸發jQuery.focus點擊它後的鏈接？也許有一個jQuery事件混合這些？重點點擊？

HTML：

<a href="#" class="focus">Focus</a> 
<a href="#" class="click">Click</a>

的JavaScript：「專注」

$(document).ready(function(){ 

    // Focus Code 
    $('.focus').focus(function(){ 
     alert('focus!'); 
    }); 

    // My noobish try to focus on click, will probably break the universe 
    /* $('.focus').click(function(){ 
     $(this).focus(); 
    }); */ 

    // This should work, but I want this link to really FOCUS 
    /* $('.focus').click(function(){ 
     alert('focus!'); 
    }); */ 

    // Click Code 
    $('.click').click(function(){ 
     alert('click!'); 
    }) 

})

我想提醒點擊「焦點」鏈接後，不僅按下TAB。

有類似的問題，但它是更爲複雜和2歲以上：jQuery handing both focus and click on an element

這裏的jsfiddle一起玩：

http://jsfiddle.net/JVTKc/

來源

2013-08-07 Wordpressor

你能更清楚地解釋你的代碼後，你想要的一部分嗎？ – woofmeow

最初我有一個鏈接，並希望這個鏈接做一些事情，如果用戶點擊它或如果用戶跳槽鏈接按TAB。看起來像.click只適用於第一種情況，而.cocus僅適用於第二種情況。另外，我希望鏈接在失去焦點時執行其他操作（或者當用戶在其他地方點擊時）。 – Wordpressor

當然，我不會使用任何警報，事實上，我正在嘗試創建一個輸入，調整點擊/焦點大小，然後在焦點/點擊失敗後恢復原始大小（Apple.com搜索表單的種類）。 – Wordpressor

我認爲你正在努力實現的是具有焦點點擊，TAB和焦點事件。

要查看我正在使用的console.log()，請在瀏覽器中打開控制檯。

HTML：

<a href="#" class="focus-test">Focus Test</a>

的Javascript/jQuery的：

$(document).ready(function(){ 
    $('.focus-test').focus(function(){ 
     //not using alert because it causes a loop because you re-focus after you dismiss the alert. 
     console.log('focus and click'); 
    }); 
    $('.focus-test').click(function(){ 
     this.focus(); 
    }); 
})

的jsfiddle：http://jsfiddle.net/JVTKc/4/

我想補充意見，你不應該觸發事件自己，而不是調用一個函數來處理兩個事件，請參閱下面的代碼。

HTML：

<a href="#" class="focus-test">Focus Test</a>

的Javascript/jQuery的：

$(document).ready(function(){ 
    $('.focus-test').focus(function(){ 
     userInteraction(); 
    }); 
    $('.focus-test').click(function(){ 
     userInteraction(); 
    }); 
    function userInteraction(){ 
     //not using alert because it causes a loop because you re-focus after you dismiss the alert. 
     console.log('focus and click and tab'); 
    } 
})

http://jsfiddle.net/JVTKc/5/

來源

2013-08-07 01:10:22

回答

相關問題