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 attribute，guess who's not supporting it?

您的插件似乎并没有帮助您克服IE不支持它的事实，因此，虽然我的解决方案有效，但您的插件并不适用。为什么不找到一个呢。

Answer 4

只需使用

即可

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

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

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

Answer 5

$(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引起了我的注意，你使用的插件并没有克服IE的HTML失败。

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

Answer 6

使用Javascript和Jquery 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");
}
}

Answer 7

将第一行移到底部是为了我：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 8

使用jQuery更改占位符文本

尝试

$('#selector').attr("placeholder", "Type placeholder");

Answer 9

如果输入在div内部，则可以尝试以下操作：

<style type="text/css">
  #south-america > path {
    fill: #FAFAFA;
  }
</style>

Answer 10

尝试

$('#Selector_ID').attr("placeholder", "your Placeholder");

Answer 11

这对我有用：

jQuery('form').attr("placeholder","Wert eingeben");

但是现在不起作用：

// Prioritize "important" elements on medium.
            skel.on('+medium -medium', function() {
                jQuery.prioritize(
                    '.important\\28 medium\\29',
                    skel.breakpoint('medium').active
                );
            });

Answer 12

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

Answer 13

$(document).ready(function(){ 
  $('form').find("input[type=search]").each(function(ev)
  {
     $(this).attr("placeholder", "Search Whatever you want");
  });
});

使用jQuery更改占位符文本

13 个答案:

或

其他插件