使用jQuery將輸入TITLE顯示爲VALUE（包括jsfiddle）

我想要拿出一個簡單的jQuery輸入水印功能。基本上，如果輸入字段沒有值，則顯示它的標題。使用jQuery將輸入TITLE顯示爲VALUE（包括jsfiddle）

我想出了必要的jQuery來分配輸入的值作爲它的標題，但它不顯示在頁面上，就好像它是一個手動編碼到表單中的值。

我怎樣才能得到這個顯示的值，當頁面加載到輸入字段中供用戶查看？

$(document).ready(function() { 

    $(".wmk").each(function(){ 
     var value = $(this).val(); 
     var title = $(this).attr("title"); 

     if (value == '') { 
     value = title; 
     } 

     $(".result").text(value); 
     // You can see I can get something else to display the value, but it does 
     // not display in the actual input field.    
    }); 

});

來源

2012-04-10 JROB

即使療法e是小提琴的鏈接，您應該將相關代碼粘貼到您的問題中。 – 2012-04-10 18:08:59

使用下面的一行代碼。您需要指定輸入元素並更新其值。由於您的輸入字段有一個名爲「.wmk」的類，因此我使用下面的代碼。您可以使用「id」並使用「＃」而不是「。」。瞭解更多關於在選擇http://api.jquery.com/category/selectors/

$(".wmk").val(value);

更新的jsfiddle http://jsfiddle.net/bhatlx/mQ3sX/9/

更新：由於您使用的是 '.wmk' 各'，你可以使用

$(this).val(value)

來源

2012-04-10 18:04:05 DG3

工程就像一個魅力！非常感謝。 – JROB 2012-04-10 18:06:54

我更新了代碼以使用'$（this）'，因爲您正在循環輸入元素與'.wmk' – DG3 2012-04-10 18:12:05

謝謝，我明白了。 :) – JROB 2012-04-10 18:18:09

而不是寫你自己，你有沒有考慮過使用現成的烘焙版本？這不完全是你所要求的，但是它們有你可能喜歡的附加功能（例如，當你開始輸入時，它就像一個普通的佔位符一樣自動隱藏佔位符）。

http://www.hagenburger.net/BLOG/HTML5-Input-Placeholder-Fix-With-jQuery.html http://archive.plugins.jquery.com/project/input-placeholder

來源

2012-04-10 18:07:53 ramblinjan

就像我發現的每個人都說，他們不適用於所有瀏覽器。 – JROB 2012-04-10 18:19:51

通常他們會說HTML5佔位符屬性只適用於某些瀏覽器。第一個鏈接有這個警告，但jQuery解決方案適用於所有瀏覽器。 – ramblinjan 2012-04-10 18:21:53

實際上，唯一的瀏覽器特定的jQuery插件帶有這種名稱，因爲它們是啓用了瀏覽器沒有的功能，而不是因爲它們在某些瀏覽器中不起作用。 – ramblinjan 2012-04-10 18:23:39

我想你想要的是這樣的：

$(document).ready(function() { 

    $(".wmk").each(function(){ 
    var value = $(this).val(); 
    var title = $(this).attr("title"); 

    if (value == '') { 
     $(this).val(title); 
    } 

    $(".result").text(value); 

    }); 

});

來源

2012-04-10 18:08:02

可能是你想要的東西象下面，

DEMO

$(document).ready(function() { 

    $(".wmk").each (function() { 
     if (this.value == '') this.value = this.title; 
    }); 

    $(".wmk").focus(
     function() { 
      if (this.value == this.title) this.value = ''; 
     } 
    ).blur(
     function() { 
      if (this.value == '') this.value = this.title; 
     } 
    ); 

}); // end doc ready

來源

2012-04-10 18:10:16

使用jQuery將輸入TITLE顯示爲VALUE（包括jsfiddle）

回答

相關問題