使用jQuery更改占位符文本

Question

我正在使用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()再次调用,它会Placeholder在事件仍绑定到旧实例时创建新实例.

查看代码,看起来你可以这样做:

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

编辑

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

你的插件似乎并没有帮助你克服IE不支持它的事实,所以当我的解决方案有效时,你的插件却没有.你为什么不找到一个.

Answer 4

只是你可以使用

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

其中,如果变量是字符串,那么你可以像上面一样使用它,如果它是变量的话,用带有双引号的"变量"之类的名称替换它.

例如:$("#youtextboxid").attr("placeholder", variable); 它会起作用.

Answer 5

$(document).ready(function(){ 
     $("input[type=search]").attr("placeholder","this is a test");
});

Answer 6

$(this).val()是一个字符串.使用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引起了我的注意,你使用的插件并没有克服IEs HTML失败.

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