使用jQuery更改占位符文本

我正在使用jQuery占位符插件（https://github.com/danielstocks/jQuery-Placeholder）。 我需要改变下拉菜单中的改变占位符文本。 但这并没有改变。 这里是代码：

$(function () { $('input[placeholder], textarea[placeholder]').placeholder(); $('#serMemdd').change(function () { var k = $(this).val(); if (k == 1) { $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").placeholder(); } else if (k == 2) { $("#serMemtb").attr("placeholder", "Type an ID").placeholder(); } else if (k == 3) { $("#serMemtb").attr("placeholder", "Type a Location").placeholder(); } }); }); 

我的Html：

 <div class="filterbox"> <select name="ddselect" id="serMemdd"> <option value="1" selected="selected">Search by Name</option> <option value="2">Search by ID</option> <option value="3">Search by Location</option> </select> <input id="serMemtb" type="text" style="width: 490px" placeholder="Type a name (Lastname, Firstname)" /> <input id="seMemBut" type="button" value="Search" /> </div> 

任何人都可以弄清楚吗？

Answer 1

 $(document).ready(function(){ $('form').find("input[type=textarea], input[type=password], textarea").each(function(ev) { if(!$(this).val()) { $(this).attr("placeholder", "Type your answer here"); } }); }); 

复制此代码并将其粘贴到您的js文件中，这将更改整个站点的所有占位符文本。

Answer 2

您可以使用以下代码通过id更新占位符：

 $("#serMemtb").attr("placeholder", "Type a Location").val("").focus().blur(); 

Answer 3

该插件看起来不健壮。 如果再次调用.placeholder() ，它将创build一个新的Placeholder实例，而事件仍然绑定到旧的实例。

看看代码，看起来你可以这样做：

 $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur(); 

---

编辑

placeholder是一个HTML5属性 ， 猜猜谁不支持它？

你的插件似乎并没有帮助你克服IE不支持它的事实，所以当我的解决scheme工作时，你的插件不能。 你为什么不find一个这样做？

Answer 4

$(this).val()是一个string。 使用parseInt($(this).val(), 10)或检查'1'。 十是表示基数10。

 $(function () { $('input[placeholder], textarea[placeholder]').blur(); $('#serMemdd').change(function () { var k = $(this).val(); if (k == '1') { $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur(); } else if (k == '2') { $("#serMemtb").attr("placeholder", "Type an ID").blur(); } else if (k == '3') { $("#serMemtb").attr("placeholder", "Type a Location").blur(); } }); }); 

要么

 $(function () { $('input[placeholder], textarea[placeholder]').placeholder(); $('#serMemdd').change(function () { var k = parseInt($(this).val(), 10); if (k == 1) { $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur(); } else if (k == 2) { $("#serMemtb").attr("placeholder", "Type an ID").blur(); } else if (k == 3) { $("#serMemtb").attr("placeholder", "Type a Location").blur(); } }); }); 

其他插件

ori引起了我的注意，你正在使用的插件没有克服IE的HTML失败。

尝试这样的： http : //archive.plugins.jquery.com/project/input-placeholder

Answer 5

只要你可以使用

 $("#yourtextboxid").attr("placeholder", "variable"); 

其中，如果variables是string，那么你可以像上面那样使用，如果它是可变的，用“双引号”之类的名称replace它。

例如： $("#youtextboxid").attr("placeholder", variable); 它会工作。

Answer 6

把你的第一行移到底部对我来说是这样的： http : //jsfiddle.net/tcloninger/SEmNX/

 $(function () { $('#serMemdd').change(function () { var k = $(this).val(); if (k == 1) { $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").placeholder(); } else if (k == 2) { $("#serMemtb").attr("placeholder", "Type an ID").placeholder(); } else if (k == 3) { $("#serMemtb").attr("placeholder", "Type a Location").placeholder(); } }); $('input[placeholder], textarea[placeholder]').placeholder(); }); 

Answer 7

使用Javascript和Jquery的dynamic占位符的工作示例http://jsfiddle.net/ogk2L14n/1/

 <input type="text" id="textbox"> <select id="selection" onchange="changeplh()"> <option>one</option> <option>two</option> <option>three</option> </select> function changeplh(){ debugger; var sel = document.getElementById("selection"); var textbx = document.getElementById("textbox"); var indexe = sel.selectedIndex; if(indexe == 0) { $("#textbox").attr("placeholder", "age"); } if(indexe == 1) { $("#textbox").attr("placeholder", "name"); } }