Question

我有以下用于评价价格范围的html：

<li class='voteable-attribute off clearfix' id='attributes_price_range'>
            <label class='primary formField'>Price Range:
            </label>
                    <fieldset id='price_choices'>
        <legend class='offscreen'>Price Range:</legend>
            <p class='offscreen'>Price per person:</p>
        <ul class='clearfix price-0'>
            <li>
                <input type='radio' id='price-1' name='RestaurantsPriceRange2' value='1'>               <label for='price-1' class='offscreen'>
                    Cheap, Under $10
                </label>
            </li>
            <li>
                <input type='radio' id='price-2' name='RestaurantsPriceRange2' value='2'>               <label for='price-2' class='offscreen'>
                    Moderate, $11 - $30
                </label>
            </li>
            <li>
                <input type='radio' id='price-3' name='RestaurantsPriceRange2' value='3'>               <label for='price-3' class='offscreen'>
                    Spendy, $31 - $60
                </label>
            </li>
            <li>
                <input type='radio' id='price-4' name='RestaurantsPriceRange2' value='4'>               <label for='price-4' class='offscreen'>
                    Splurge, Over $61
                </label>
            </li>
        </ul>
    </fieldset>
            <span class='no-js-hidden pseudoLink' id='price_tip' title='' style='cursor: auto;'>Price per person:</span>
        <span class='no-js-hidden' id='price_range'>Roll over price, then click to vote </span>
</li>

这些是我的js代码，我们将鼠标移到ul ul类中的任何li，默认情况下price-0将替换为当前所选li的id。

这是我的javascript。我希望price-0的班级ul更改为您悬停在的li的ID。

$('#price_choices ul').mouseover(function(){
        var val = $(this).find('li input').attr('value');

        $(this).removeClass(/price-[a-zA-Z0-9_]*/g, '');
        $(this).addClass('price-'+val+'');

    });

如何用指定的id替换classname？我当前的代码只是添加了类，最后我得到了一个类似于price-0 price-1 price-2..等的类列表

Answer 1

尝试：

$('#price_choices ul > li').mouseover(function(){
   var $li = $(this),
   val = $li.find('input').val();
    //alert(val);
   var preClass=  $li.parents("ul").attr("class"); 
   $li.parents("ul").removeClass(preClass);
   $li.parents("ul").addClass('price-'+val);
});

演示:: jsFiddle

Jquery鼠标悬停值

1 个答案: