textarea佔位符明確焦點

我試圖用jquery實現基本的佔位符邏輯textarea ..但有一個小問題，我無法弄清楚如何解決它。這裏是html;textarea佔位符明確焦點

<textarea class="commentInput" rows="1" cols="50" title="Say something..."> 
    Say something... 
</textarea>

和javascript是;

$('.commentInput').live('focus', function() { 
    if ($(this).val() == $(this).attr('title')) { 
     $(this).val(''); 
    } 
}); 

$('.commentInput').live('blur', function() { 
    if ($(this).val() == '' && $(this).attr('title') != '') { 
     $(this).val($(this).attr('title')); 
     $(this).attr('rows', 1); 
    } 
});

這是所有工作正常，但一個情況下，它的分解。讓說我鍵入「說什麼......」到textarea的，只是點擊到別的地方在HTML中，然後當我焦點回到textarea的是清除文本因爲jquery焦點事件匹配textarea的值和文本區域的標題..

我該如何解決它或任何其他想法？謝謝。

來源

2011-11-26 Fatih Donmez

想不出明白你想面對 –

你想爲IE做的問題吧？有很多PlugIn的。例如：http://code.google.com/p/jquery-placeholder-js/或https://github.com/mathiasbynens/Placeholder-jQuery-Plugin – noob

我認爲你正在尋找類似這樣的東西： http://stackoverflow.com/questions/5059732/jquery-textarea-default-value-disppear-on-click/5059842#5059842 – ScottE

根據這些規則保持一個標誌isDirty文本區域元素，並設置標誌的值上onKeyUp事件文本區域：

如果在文本區域內的文本，那麼用戶必須具有輸入它以便設置爲「髒」爲真;
如果文本區域是空的，然後設置isDirty假

更新：我發現一個bug，下面的規則是用來去除這個bug。當你用鼠標選擇文本時，右鍵單擊它並剪切文本;由於沒有keyup事件發射，isDirty標誌保持爲真，功能丟失。

像這樣：

$('.commentInput').live('keyup', function() { 
    var taObj = $(this); 
    if ($(this).val() == '') { 
     taObj.data('isDirty', false); 
    } else { 
     taObj.data('isDirty', true); 
    }  
});

然後使用isDirty標誌來確定文本是否應修改或不：

$('.commentInput').live('focus', function() { 
    var taObj= $(this); 

    if (!taObj.data('isDirty') && taObj.val() == taObj.attr('title')) { 
     taObj.val(''); 
    } 
}); 

$('.commentInput').live('blur', function() { 
    var taObj = $(this); 

    // Following check is made to make sure text was not removed with a mouse action 
    if(taObj.val() == '') { 
     taObj.data('isDirty', false); 
    } 

    if (!taObj.data('isDirty') && taObj.val() == '' && taObj.attr('title') != '') { 
     taObj.val(taObj.attr('title')).attr('rows', 1); 
    } 
});

這裏是一個小提琴示例演示此解決方案：http://jsfiddle.net/melih/WXxtg/2/

來源

2011-11-26 20:48:27 melihcelik

teşekkürleradamım。 –

這不是一個特別好的解決方案。而不是使用全局'isDirty'可變的，而是使用'jQuery.data（）'來存儲該元素的標誌。以這種方式完成，您不會污染全局名稱空間，並且可以使用多個元素來完成此操作。 – Bojangles

@JamWaffles你說得對，我沒有完全正確的定義一個全局變量，但是我不應該使用全局jQuery對象來保持這個值？也許我應該更多地使用jQuery.data（）。謝謝。 – melihcelik

它不清楚你想要textarea做什麼和JavaScript做到這一點。如果textarea中的文本與給textarea的標題相同，則第一個代碼將清除textarea。如果我明白你寫的是什麼 - 你不應該擺脫焦點事件代碼嗎？

來源

2011-11-26 20:46:55 Ross

我想要做的是當用戶輸入一些文本到textarea，只是保持它在textarea中是否關注textarea，但如果textarea是空的，那麼放置文字，如「說點什麼......」，問題是如果用戶輸入「說點什麼......」，並將焦點放在textarea一段時間，那麼如果用戶點擊返回到textarea它清除「說些什麼......」文本，用戶已經輸入，就像它的佔位符文本，因此清除新輸入的區域。 –

textarea佔位符明確焦點

回答

相關問題