我的jquery代码不适用于最后一个div

时间:2014-10-22 19:18:14

标签: javascript jquery html css

我正在动态创建div,我用以下代码替换了一些文本:

$('p.project-category').each(function()
{
    if($(this).text()==='Conferences --Events')
    {
        $('p.project-category').text('Conferences --Events').replaceWith('<p class="project-category">Conferences / Events</p>')
    }  
    else if ($(this).text()==='Html Emails')
    {
        $('p.project-category').text('Html Emails').replaceWith('<p class="project-category">HTML E-Mails</p>')
    }
    else if ($(this).text()==='Periodicals Reports')
    {
        $('p.project-category').text('Conferences Events').replaceWith('<p class="project-category">Periodicals / Reports</p>')
    }   
    else if ($(this).text()==='Sales Collateral---standard')
    {
        $('p.project-category').text('Sales Collateral---standard').replaceWith('<p class="project-category">Sales Collateral (Standard)</p>')
    }
    else if ($(this).text()==='Sites Apps')
    {
        $('p.project-category').text('Sites Apps').replaceWith('<p class="project-category">Web Sites / Digital Apps</p>')
    }
});

这适用于除最后一个div之外的所有人。有什么理由说这不起作用吗?

1 个答案:

答案 0 :(得分:1)

你有一种方式过于凌乱if .. then .. else有条件。您可以使用switch .. case代替。

此外,您似乎尝试使用.text()方法作为选择器,这是错误的。它已用于set/get所选元素中的文字。

最后,当您可以替换其文本时,您将替换整个元素。

$('p.project-category').each(function (el, ix) {
    var text = $(this).text().trim().toLowerCase();
    var newText = '';

    switch (text) {
        case 'conferences --events':
            newText = 'Conferences / Events';
            break;

        case 'html emails':
            newText = 'HTML E-Mails';
            break;

        case 'periodicals reports':
            newText = 'Periodicals / Report';
            break;


        case 'sales collateral---standard':
            newText = 'Sales Collateral (Standard)';
            break;

        case 'sites apps':
            newText = 'Web Sites / Digital Apps';
            break;

    }

    $(this).text(newText);
});

Demo

注意我假设您的HTML标记中没有拼写错误,我建议您在进行比较时依赖代码处理文本内容。