問題描述
我不完全確定這是否可能，總的來說，我對 jQuery 和 JavaScript 非常了解，但是這個讓我很難過.我創(chuàng)建了一個簡單的插件，它清除焦點上的文本輸入，然后在沒有輸入任何內容時顯示默認值.
I am not entirely sure if this is possible or not, I am pretty knowledgeable when it comes to jQuery and JavaScript in general, but this one has me stumped. I've created a simple plugin that clears a text input on focus and then displays the default value if nothing has been entered.
是否可以僅淡出文本輸入中的文本本身，而不是整個字段本身?所有嘗試似乎都導致文本字段本身淡出并最終隱藏元素.
Is it possible to fade out just the text itself inside of the text input, and not the whole field itself? All attempts seem to result in the text field itself fading out and eventually hiding the element from view.
我確實想出了一個解決方案，使用包含默認值的跨度并將它們絕對定位在文本輸入上，根據用戶是否輸入任何文本來隱藏和顯示它們.如果存在的話，我寧愿采用一種更直接的方法.
I did come up with a solution of using spans containing the default value and absolutely positioning them over the text input, hiding and showing them depending if a user has entered any text or not. I would much rather a much straightforward approach if one exists.
編輯
使用 jQuery UI 中或作為 jQuery 插件提供的 jQuery animate 函數，您可以將文本顏色設置為在字段聚焦和模糊時輸入的顏色(如下所述).這是我正在使用的代碼，以防您想知道如何操作.
Using the jQuery animate function which is in jQuery UI or available as a plugin for jQuery, you can animate the text color to be the color of the input upon focusing and blurring of the field (as pointed out below). Here is the code that I am using in-case you wanted to know how.
obj.bind("focus", function() {
if ($(this).val() == oldValue) {
$(this).animate({ color: '#E8DFCC' }, 1000).val('');
}
});
obj.bind("blur", function() {
if ($(this).val().length <= 3) {
$(this).animate({ color: '#56361E' }, 600).val(oldValue);
}
});
推薦答案
想一想，你有沒有試過用動畫的方法改變文本框中的文字顏色以匹配背景?然后動畫完成后就可以清空內容了.
Just a quick thought, have you tried using the animation method to change the color of the text in the text box to match the background? Then when the animation completes you can clear the contents.
這是一個想法.我已經有一段時間沒有使用動畫了，但如果你有興趣，我可能會制作一個代碼示例.
Its a thought. Its been a while since I've used the animation stuff, but I could probably whip up a code sample if you are interested.
這篇關于使用jQuery淡出文本字段內的文本值的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！