jquery - 根据jquery中的H2文字切换图片

Question

我是整个 jQuery 的新手。我正在尝试在 kentico CMS 中创建一个网站，我想要的是根据h2标题内容更改标题图像。所以每个不同的页面都会得到不同的图像。

我试过了.addClass，.css但.attr似乎没有任何效果。我试过的jQuery如下：

$(document).ready (function() {
{

var title = $('h2').text(); 

switch(title)
{
    case 'About us':
        $('.contentHeader').addClass('contentAbout')
        break;
    case 'Education':
        $('.contentHeader').css('background-image','url(/edu.png)')
        break;
    case 'Projects':
        $('.contentHeader').attr('src','/projects.png')
        break;
    case 'Benefits':
        $('.contentHeader').attr('src','/benefits.png')
        break;
    default:

}



)};

所以基本上我想将标题更改为edu.pngif the h2text = Education.

Answer 1

尝试更改)};到});最后一行，如果不需要default:，请不要使用它。

也{从第 2 行删除（感谢彼得）

$(function() { // DOM ready (shorthand)

    var title = $('h2').text(); 

    switch(title){
        case 'About us':
            $('.contentHeader').addClass('contentAbout');
            break;
        case 'Education':
            $('.contentHeader').css('background-image','url(/edu.png)');
            break;
        case 'Projects':
            $('.contentHeader').attr('src','/projects.png');
            break;
        case 'Benefits':
            $('.contentHeader').attr('src','/benefits.png');
            break;
    }

});

你也可以这样做：

$(function(){ 

  var title = $('h2').text(); 

  var changes = {
    'About us'  : ['addClass', 'contentAbout'],
    'Education' : ['css',      {backgroundImage: "url(/edu.png)"}],
    'Projects'  : ['attr',     {src: "/projects.png"}],
    'Benefits'  : ['attr',     {src: "/benefits.png"}]
  };

  var method = changes[title][0];
  var valu   = changes[title][1];

  $('.contentHeader')[method](valu);

});