0

我需要根据 mvc 3 中 ddl 的选定索引值显示标签的背景图像。如果选定的文本是“A”,则将背景图像设置为无,否则,使用图像设置背景图像。但是第一部分(不做任何事情)对我有用,同样,如果我选择其他值,它不会重置图像。它总是显示背景为空。它总是为图像选择错误的路径。

我的代码如下

$('#ddl').change(function () {
    if ($("#ddl option:selected").text() == 'Emergency Contact') {
        $('.width label#contact').css("background", "none");
    } else {
        $(".width label#contact").css('background-image', 'url("/Content/images/help.jpg")');
    }
});

else 部分总是采用错误的图像路径。我的图像位于以下文件夹 D:\projectname\UI\Content\Images

4

2 回答 2

0

您的 js 代码似乎没问题:也许 html 中的路径 $(".width label#contact") 是错误的?你能显示你的html代码吗?

这是我让它工作的一个例子:

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Untitled</title>
    <link rel="author" href="humans.txt">
</head>
<body>
    <div class="width"><label for="" id="contact" style="width:400px;height:400px;display:block;">helloworld</label></div>
    <p></p>
    <p></p>
    <p></p>
    <select name="" id="ddl">
        <option value="">other 1</option>
        <option value="">Emergency Contact</option>
        <option value="">other 2</option>

    </select>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
    <script>
    $().ready(function () {
        $('#ddl').change(function () {
            if ($("#ddl option:selected").text() == 'Emergency Contact') {
                $('.width label#contact').css("background", "none");
            }
            else {
                $(".width label#contact").css('background-image', 'url("https://www.google.fr/images/srpr/logo11w.png")');
                 }
        });
    })

    </script>
</body>

于 2013-10-28T11:28:28.457 回答
0

这看起来像是一个真实的路径问题。试试这个方法:

$(".width label#contact").css('background-image', 'url("Content/images/help.jpg")');

还可以考虑使用这种替代方法:

CSS:

#contact.help {
  background-image:url("Content/images/help.jpg");
}

jQuery:

$(".width label#contact").toggleClass('help');
于 2013-10-28T11:28:50.803 回答