水印文本框在MVC3

如何設置水印在MVC3。還有一個texbox如果在一個網頁多個文本框，你怎麼寫的每一個文本框不同的水印文字？水印文本框在MVC3

 <%:Html.TextBoxFor(mdl => mdl.inputTextSearch, Model.inputTextSearch)%>

感謝您迴應

來源

2011-06-22 Sweta

水印在何種意義上，一個JavaScript的解決方案或新的HTML5 [佔位符]（HTTP：// davidwalsh。名稱/ HTML5佔位符）？ –

如果我理解你的問題，你可以通過在：

new { placeholder = "my watermark" }

在Html.TextBoxFor的htmlAttributes參數。

編輯：

您也可以使用JavaScript作爲概述這裏添加對老版本瀏覽器的支持：

http://www.standardista.com/html5-placeholder-attribute-script

來源

2011-06-22 19:18:53 gram

我想，較早和IAM收到這個錯誤，對於方法沒有過載 'TextBoxFor' 接受3個參數 – Sweta

嘗試這樣：<％：Html.TextBoxFor（MDL => mdl.inputTextSearch，新的{佔位符= 「我的水印」}）％ > – gram

我通常只使用下面的jQuery，對MVC項目上需要一個領域水印：（與IE 6兼容的代碼 - 9，火狐2 - 4，野生4.

$('#UserSearch').Watermark("Search term", "#fff");

/// jQuery插件代碼

(function($) { 
var map=new Array(); 
$.Watermark = { 
    ShowAll:function(){ 
     for (var i=0;i<map.length;i++){ 
      if(map[i].obj.val()==""){ 
       map[i].obj.val(map[i].text);      
       map[i].obj.css("color",map[i].WatermarkColor); 
      }else{ 
       map[i].obj.css("color",map[i].DefaultColor); 
      } 
     } 
    }, 
    HideAll:function(){ 
     for (var i=0;i<map.length;i++){ 
      if(map[i].obj.val()==map[i].text) 
       map[i].obj.val("");     
     } 
    } 
} 

$.fn.Watermark = function(text,color) { 
    if(!color) 
     color="#aaa"; 
    return this.each(
     function(){  
      var input=$(this); 
      var defaultColor=input.css("color"); 
      map[map.length]={text:text,obj:input,DefaultColor:defaultColor,WatermarkColor:color}; 
      function clearMessage(){ 
       if(input.val()==text) 
        input.val(""); 
       input.css("color",defaultColor); 
      } 

      function insertMessage(){ 
       if(input.val().length==0 || input.val()==text){ 
        input.val(text); 
        input.css("color",color); 
       }else 
        input.css("color",defaultColor);     
      } 

      input.focus(clearMessage); 
      input.blur(insertMessage);        
      input.change(insertMessage); 

      insertMessage(); 
     } 
    ); 
}; 
})(jQuery);

來源

2011-06-23 23:48:01 Nickz

謝謝！它的工作原理http://jsfiddle.net/maxim75/yJuF3/ –

這種方法的唯一問題是，當用戶在水印字段中沒有輸入任何內容時，由於水印被認爲是值，因此字段驗證正確。 – Ben

我通過刪除水印onSubmit HideAll處理了這個問題。我發現了一個更完整的版本，我把上面的插件放在一起。 http://code.google.com/p/jquery-watermark/。希望這可以幫助你。 – Nickz

試試這個jquery。你需要用水印文本創建一個圖像。

$(document).ready(function() { 

      /*Watermark for date fields*/ 

      if ($("#dob").val() == "") { 
       $("#dob").css("background", "#ebebeb url('/Content/images/DateWaterMark.png') no-repeat 1px 0px"); 
      } 

      $("#dob").focus(function() { 
       if (watermark == 'MM/DD/YYYY') { 
        $("#dob").css("background-image", "none"); 
        $("#dob").css("background-color", "#fff"); 
       } 
      }).blur(function() { 
       if (this.value == "") { 
        $("#dob").css("background", "#ebebeb url('/Content/images/DateWaterMark.png') no-repeat 1px 0px"); 
       } 
      }); 

      $("#dob").change(function() { 
       if (this.value.length > 0) { 
        $("#dob").css("background", "#fff"); 
       } 
      }); 
}

來源

2012-05-18 23:10:27 amazing

使用MVC 3標準，並且兼容HTML5的瀏覽器，你可以這樣做：

@Html.TextBoxFor(mdl => mdl.inputTextSearch, new { placeholder = "my watermark" })

來源

2012-08-16 20:06:28

謝謝，它的工作。 :) –

水印文本框在MVC3

回答

相關問題