语法错误,无法识别的表达式:!在jQuery选择器中检查

我在一个带有jquery 1.7的网站上使用这个脚本 .

$('input:radio[name=article-info]:!checked').parent().parent().removeClass('highlight')

我在引导程序模板中移动此脚本,但chrome控制台报告我此错误:

未捕获错误:语法错误,无法识别的表达式:input:radio [name = article-info]:!已选中

Bootstrap使用jQuery的更新版本 .

我该怎么用这个版本的语法?

完整的代码:

// Select input radio button
        $('input[type=radio][name=article-info]').change(function() {

               $('input:radio[name=article-info]:not(:checked)').parent().parent().removeClass('highlight');
               $(this).parent().parent().addClass('highlight');

               // Price
               $price = $('label[for="'+ $(this).attr('id') +'"] .tr-price').text();
               $('#price-total').text($price);

               // Url btn
               $new_url = $(this).parent().siblings('.format').children().children('input').val();
               $('#btn-personalizar').attr("href", $new_url);
         });
//Select tr
        $(".data-click-tr").click(function(){


               $(".data-click-tr").removeClass('highlight')
               $(this).addClass('highlight').find('input:radio[name=article-info]').attr('checked', true);

               $get_input_id = $(this).find('input:radio[name=article-info]').val();

               // Precio
               $price = $('label[for="'+ $get_input_id +'"] .tr-price').text();
               $('#price-total').text($price);

               // Url btn personalizar
               $new_url = $(this).find('.format').children().children('input').val();
               $('#btn-personalizar').attr("href", $new_url);
         });

HTML:

<table id="select-size">
    <thead class="size-and-price">
        <tr class="header-table">
            <th colspan="2">Tamaño</th>
            <th class="">Precio</th>
        </tr>
    </thead>
    <tbody>
        <tr class="data-click-tr highlight" data-click-tr="1426">
            <td class="input">
                <input id="1426" type="radio" name="article-info" value="1426" checked="checked">
            </td>
            <td class="format">
                <label for="">720X1080 mm <a href="//localhost:3000/manta-polar-75x100/1426">(ver ficha)</a>
                <input class="url-designs" type="hidden" value="//localhost:3000/modelos/manta-polar-75x100/1426">
                </label>
            </td>
            <td class="price">
                <label for="1426">
                <span class="tr-price"> 39&nbsp;€</span>
                </label>
            </td>
        </tr>
        <tr class="data-click-tr" data-click-tr="6685">
            <td class="input">
                <input id="6685" type="radio" name="article-info" value="6685">
            </td>
            <td class="format">
                <label for="">950X1400 mm <a href="//localhost:3000/manta-polar-95x140/6685">(ver ficha)</a>
                <input class="url-designs" type="hidden" value="//localhost:3000/modelos/manta-polar-95x140/6685">
                </label>
            </td>
            <td class="price">
                <label for="6685">
                <span class="tr-price"> 49&nbsp;€</span>
                </label>
            </td>
        </tr>
        <tr class="data-click-tr" data-click-tr="710">
            <td class="input">
                <input id="710" type="radio" name="article-info" value="710">
            </td>
            <td class="format">
                <label for="">1200X1900 mm <a href="//localhost:3000/manta-polar-120x190/710">(ver ficha)</a>
                <input class="url-designs" type="hidden" value="//localhost:3000/modelos/manta-polar-120x190/710">
                </label>
            </td>
            <td class="price">
                <label for="710">
                <span class="tr-price"> 69&nbsp;€</span>
                </label>
            </td>
        </tr>
        <tr class="data-click-tr" data-click-tr="2259">
            <td class="input">
                <input id="2259" type="radio" name="article-info" value="2259">
            </td>
            <td class="format">
                <label for="">2400X1600 mm <a href="//localhost:3000/manta-polar-160x240-queen/2259">(ver ficha)</a>
                <input class="url-designs" type="hidden" value="//localhost:3000/modelos/manta-polar-160x240-queen/2259">
                </label>
            </td>
            <td class="price">
                <label for="2259">
                <span class="tr-price"> 89&nbsp;€</span>
                </label>
            </td>
        </tr>
    </tbody>
</table>

这是一个截图:
enter image description here

回答(2)

3 years ago

! 运算符不能在选择器中使用 .

您可以使用:not()选择器反转选择器 .

$(':radio[name="article-info"]:not(:checked)')...
                              ^^^^^^^^^^^^^^

选择器中的 :not(:checked) 部分将选择未选中的单选按钮 .

3 years ago

要添加阴性对照,必须使用 :not()

$('input:radio[name=article-info]:not(:checked)').parent().parent().removeClass('highlight')