未捕获错误:语法错误,不支持伪

时间:2016-05-10 07:18:38

标签: jquery syntax selector

我正在尝试修复代码中的错误,这非常奇怪。我有以下代码创建一个HTML。它在单击div时调用RemoveCompareOffer()函数。此函数适用于所有类型的id,除了一个ADSL2:Bundles

的ID

创建HTML的功能:

function AddCompareOfferInCompareBox()
{
    $('.SelectedOffer').each(function () {
        innerHtml = innerHtml + '<div class="compare-box"> <div class="compare-close"><span class="closed" onclick="RemoveCompareOffer(\''+ $(this).attr("id") + '\')"><i class="fa fa-times"></i></span></div>'
             + '<div class="compare-logo"><img src="' + $(this).attr("imagelink") + '" /></div><p>' + $(this).attr("offername") + '</p>'
             + '<input type="button" value="View Details" class="viewbtn" onclick="CallOfferRenderAction(\'' + $(this).attr("offercode") + '\',\'' + $(this).attr("providercode") + '\')" /></div>';
    });

    $(".AddCompareOfferByMe").html(innerHtml);
}

在调用此函数时,如RemoveCompareOffer('ADSL2:Bundles')

function RemoveCompareOffer(id) {
    $('#' + id + '.SelectedOffer').removeClass("SelectedOffer").addClass("NotSelected").attr('checked', false);
    AddCompareOfferInCompareBox();
    SetCompareBoxsState();
}

它引发错误:

  

jquery-1.11.3.min.js:3未捕获错误:语法错误,无法识别   expression:unsupported pseudo:Bundles

可能是什么原因?

1 个答案:

答案 0 :(得分:3)

#ADSL2:Bundles.SelectedOffer是一个选择器,用于找到以下元素:

  • id ADSL2

  • 匹配伪类:Bundles

  • 是否有课程SelectedOffer

没有CSS伪类:Bundles也没有jQuery添加自己的;在您的情况下,它是ID的一部分。因此,您必须转义:或使用属性匹配语法。

逃逸:

var id = "ADSL2:Bundles";
$('#' + id.replace(/:/g, "\\:") + '.SelectedOffer').css("color", "blue");
<div id="ADSL2:Bundles" class="SelectedOffer">Escaping</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

使用属性匹配语法:

var id = "ADSL2:Bundles";
$('[id="' + id + '"].SelectedOffer').css("color", "blue");
<div id="ADSL2:Bundles" class="SelectedOffer">Escaping</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>