Question

以下是基于select-dropdown的占位符事件：

$('#A').change(function () {
    var k = $(this).val();
    if (k == 1) {
         $("#B_input-text").attr("placeholder", "this").placeholder();
    }else if (k == 2) {
        $("#B_input-text").attr("placeholder", "this too").placeholder();

这会根据某些#B选择菜单更改占位符。我的问题是，如何进行这些更改backround-image？

请注意，这不是div，而是输入文本标记。

Answer 1

您必须使用 css 功能。

$("#B_input-text")
.attr("placeholder", "this")
.placeholder()
.css('backgroundImage', 'url("path/to/image/here")');

$("#B_input-text")
.attr("placeholder", "this too")
.placeholder()
.css('backgroundImage', 'url("path/to/image/here")');

你需要传递一个具有所需css特性的对象。

var backgroundCss = {
    'backgroundImage': 'url("path/to/image/here")',
    'backgroundRepeat': 'no-repeat',
    'backgroundPosition': '50% 50%',
  };
$("#B_input-text").css(backgroundCss);

Answer 2

点击此处DEMO http://jsfiddle.net/yeyene/Kve8L/1/

为新背景创建css类，并使用jquery removeClass和addClass

您可以添加班级中的任何其他属性。

$('#A').change(function () {
    var k = $(this).val();
    if (k == 1) {
        $("input#B_input-text")
            .removeClass('old_bg').addClass('new_bg')
            .attr("placeholder", "I am blue background image and other background properties").placeholder();

    } else if (k == 2) {
        $("input#B_input-text")
            .removeClass('new_bg').addClass('old_bg')
            .attr("placeholder", "this too").placeholder();
    }
});

如何使用jquery更改输入文本背景图像

2 个答案: