更改佔位符文本焦點

Question

是否有一個簡單的解決方案，用於在輸入焦點時更改佔位符文本？例如：當輸入是有源

<input type="text" placeholder="enter your email address..."> 

：

<input type="text" placeholder="Join our mailing list!"> 

將成爲此。

Answer 1

$('input').focus(function() { 
    $(this).attr('placeholder', 'enter your email address...') 
}).blur(function() { 
    $(this).attr('placeholder', 'Join our mailing list!') 
}) 

http://jsfiddle.net/ByLGs/

• attr
• focus
• blur

Answer 2

你有這個標記 「jQuery的」，所以我假定你打開使用。這裏有一個簡單的方法：

<input type="text" placeholder="Join our mailing list!" title="enter your email address...">​ 

$('input').on('focus', function(){ 
    $(this).data('placeholder', $(this).attr('placeholder')); // Store for blur 
    $(this).attr('placeholder', $(this).attr('title')); 
}).on('blur', function(){ 
    $(this).attr('placeholder', $(this).data('placeholder')); 
});​ 

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

這可以縮短，但你的想法。通過這種方式，您不必跟蹤JavaScript中的屬性值，這些都在HTML中，因此它是一種萬能的解決方案。如果使用title不符合您的需求，則可以使用data-屬性代替或使用其他屬性。