Использование заполнителем <жерех: TextBox для IE 10 не работает

Question

Я этот код в моем HTML код:

<asp:TextBox ID="txtSearch" runat="server" CssClass="input-xxlarge" type="text" Font-Size="10px" placeholder="Type Here" Height="20px" Width="100px" ></asp:TextBox> 

Место держатель не отображается на странице.

Я думаю, что проблема связана с IE10.

Есть ли способ показать держатель места внутри <asp:TextBox?

Answer 1

Я решил вопрос с помощью JavaScript кода .Это действительно просто.

Я хотел поделиться им с вами. Вам не нужно ничего делать, просто используйте этот js, и он будет работать.

var _debug = false; 
var _placeholderSupport = function() { 
var t = document.createElement("input"); 
t.type = "text"; 
return (typeof t.placeholder !== "undefined"); 
}(); 

    window.onload = function() { 
var arrInputs = document.getElementsByTagName("input"); 
var arrTextareas = document.getElementsByTagName("textarea"); 
var combinedArray = []; 
for (var i = 0; i < arrInputs.length; i++) 
    combinedArray.push(arrInputs[i]); 
for (var i = 0; i < arrTextareas.length; i++) 
    combinedArray.push(arrTextareas[i]); 
for (var i = 0; i < combinedArray.length; i++) { 
    var curInput = combinedArray[i]; 
    if (!curInput.type || curInput.type == "" || curInput.type == "text" || curInput.type == "textarea") 
     HandlePlaceholder(curInput); 
    else if (curInput.type == "password") 
     ReplaceWithText(curInput); 
} 

if (!_placeholderSupport) { 
    for (var i = 0; i < document.forms.length; i++) { 
     var oForm = document.forms[i]; 
     if (oForm.attachEvent) { 
      oForm.attachEvent("onsubmit", function() { 
       PlaceholderFormSubmit(oForm); 
      }); 
     } 
     else if (oForm.addEventListener) 
      oForm.addEventListener("submit", function() { 
       PlaceholderFormSubmit(oForm); 
      }, false); 
    } 
} 
}; 

function PlaceholderFormSubmit(oForm) { 
for (var i = 0; i < oForm.elements.length; i++) { 
    var curElement = oForm.elements[i]; 
    HandlePlaceholderItemSubmit(curElement); 
    } 
    } 

    function HandlePlaceholderItemSubmit(element) { 
if (element.name) { 
    var curPlaceholder = element.getAttribute("placeholder"); 
    if (curPlaceholder && curPlaceholder.length > 0 && element.value === curPlaceholder) { 
     element.value = ""; 
     window.setTimeout(function() { 
      element.value = curPlaceholder; 
     }, 100); 
    } 
} 
    } 

     function ReplaceWithText(oPasswordTextbox) { 
if (_placeholderSupport) 
    return; 
var oTextbox = document.createElement("input"); 
oTextbox.type = "text"; 
oTextbox.id = oPasswordTextbox.id; 
oTextbox.name = oPasswordTextbox.name; 
//oTextbox.style = oPasswordTextbox.style; 
oTextbox.className = oPasswordTextbox.className; 
for (var i = 0; i < oPasswordTextbox.attributes.length; i++) { 
    var curName = oPasswordTextbox.attributes.item(i).nodeName; 
    var curValue = oPasswordTextbox.attributes.item(i).nodeValue; 
    if (curName !== "type" && curName !== "name") { 
     oTextbox.setAttribute(curName, curValue); 
    } 
} 

oTextbox.originalTextbox = oPasswordTextbox; 
oPasswordTextbox.parentNode.replaceChild(oTextbox, oPasswordTextbox); 
HandlePlaceholder(oTextbox); 
if (!_placeholderSupport) { 
    oPasswordTextbox.onblur = function() { 
     if (this.dummyTextbox && this.value.length === 0) { 
      this.parentNode.replaceChild(this.dummyTextbox, this); 
     } 
     }; 
    } 
} 

    function HandlePlaceholder(oTextbox) { 
    if (!_placeholderSupport) { 
    var curPlaceholder = oTextbox.getAttribute("placeholder"); 
    if (curPlaceholder && curPlaceholder.length > 0) { 
     Debug("Placeholder found for input box '" + oTextbox.name + "': " + curPlaceholder); 
     oTextbox.value = curPlaceholder; 
     oTextbox.setAttribute("old_color", oTextbox.style.color); 
     oTextbox.style.color = "#c0c0c0"; 
     oTextbox.onfocus = function() { 
      var _this = this; 
      if (this.originalTextbox) { 
       _this = this.originalTextbox; 
       _this.dummyTextbox = this; 
       this.parentNode.replaceChild(this.originalTextbox, this); 
       _this.focus(); 
      } 
      Debug("input box '" + _this.name + "' focus"); 
      _this.style.color = _this.getAttribute("old_color"); 
      if (_this.value === curPlaceholder) 
       _this.value = ""; 
     }; 
     oTextbox.onblur = function() { 
      var _this = this; 
      Debug("input box '" + _this.name + "' blur"); 
      if (_this.value === "") { 
       _this.style.color = "#c0c0c0"; 
       _this.value = curPlaceholder; 
      } 
     }; 
    } 
    else { 
      Debug("input box '" + oTextbox.name + "' does not have placeholder attribute"); 
     } 
    } 
    else { 
     Debug("browser has native support for placeholder"); 
    } 
} 

function Debug(msg) { 
if (typeof _debug !== "undefined" && _debug) { 
    var oConsole = document.getElementById("Console"); 
    if (!oConsole) { 
     oConsole = document.createElement("div"); 
     oConsole.id = "Console"; 
     document.body.appendChild(oConsole); 
    } 
    oConsole.innerHTML += msg + "<br />"; 
    } 
    } 

Answer 2

Не проблема в IE-10. Пожалуйста, нажмите клавишу F12 в вашем браузере IE и выберите Browser Mode:IE10, Режим документа:Стандартный