0

html 希望根据 .offer_miliage 中的位置显示项目

<div class="offer_list clearfix">
    <div class="offer_item clearfix">
        <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_01.jpg" alt=""/></a>

        </div>
        <div class="offer_aside">
                <h2><a href="offers-details.html">Project 1</a></h2>

            <div class="offer_descr">
                <p>content description</p>
            </div>
            <div class="offer_data">
                <div class="offer_price">32.690</div> <span class="offer_miliage">Nungambakkam</span>

            </div>
        </div>
    </div>
    <div class="offer_item clearfix">
        <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_02.jpg" alt=""></a>

        </div>
        <div class="offer_aside">
                <h2><a href="offers-details.html">Project 2</a></h2>

            <div class="offer_descr">
                <p>content description</p>
            </div>
            <div class="offer_data">
                <div class="offer_price">56.300</div> <span class="offer_miliage">Choolaimedu</span>

            </div>
        </div>
    </div>
    <div class="offer_item clearfix">
        <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_03.jpg" alt=""></a>

        </div>
        <div class="offer_aside">
                <h2><a href="offers-details.html">Project 3</a></h2>

            <div class="offer_descr">
                <p>content description</p>
            </div>
            <div class="offer_data">
                <div class="offer_price">47.000</div> <span class="offer_miliage">T Nangar</span> 
            </div>
        </div>
    </div>
    <div class="offer_item clearfix">
        <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_04.jpg" alt=""></a>

        </div>
        <div class="offer_aside">
                <h2><a href="offers-details.html">Project 4</a></h2>

            <div class="offer_descr">
                <p>content description</p>
            </div>
            <div class="offer_data">
                <div class="offer_price">26.750</div> <span class="offer_miliage">Pallavaram</span>

            </div>
        </div>
    </div>
    <div class="offer_item clearfix">
        <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_05.jpg" alt=""></a>

        </div>
        <div class="offer_aside">
                <h2><a href="offers-details.html">Project 5</a></h2>

            <div class="offer_descr">
                <p>content description</p>
            </div>
            <div class="offer_data">
                <div class="offer_price">33.300</div> <span class="offer_miliage">Tambaram</span> 
            </div>
        </div>
    </div>
    <div class="offer_item clearfix">
        <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_06.jpg" alt=""></a>

        </div>
        <div class="offer_aside">
                <h2><a href="offers-details.html">Project 6</a></h2>

            <div class="offer_descr">
                <p>content description</p>
            </div>
            <div class="offer_data">
                <div class="offer_price">44.300</div> <span class="offer_miliage">fort</span> 
            </div>
        </div>
    </div>
    <div class="offer_item clearfix">
        <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_07.jpg" alt=""></a>

        </div>
        <div class="offer_aside">
                <h2><a href="offers-details.html">Project 7</a></h2>

            <div class="offer_descr">
                <p>content description</p>
            </div>
            <div class="offer_data">
                <div class="offer_price">48.500</div> <span class="offer_miliage">Fort</span> 
            </div>
        </div>
    </div>
    <div class="offer_item clearfix">
        <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_08.jpg" alt=""></a>

        </div>
        <div class="offer_aside">
                <h2><a href="offers-details.html">Project 8</a></h2>

            <div class="offer_descr">
                <p>content description</p>
            </div>
            <div class="offer_data">
                <div class="offer_price">63.300</div> <span class="offer_miliage">Nungambakkam</span>

            </div>
        </div>
    </div>
</div>
<div class="widget-container widget_adv_filter">
        <h3 class="widget-title">ADJUST SEARCH RESULTS</h3>

    <form action="#" method="get" class="side_form">
        <div class="row field_select" style="z-index:8">
            <label class="label_title">Location:</label>
            <select class="select_styled white_select" name="car_year" id='select'>
                <option value="1">Pallavaram</option>
                <option value="2">T Nagar</option>
                <option value="3">Nungambakkam</option>
                <option value="4">Choolaimedu</option>
                <option value="5">Fort</option>
            </select>
        </div>
        <div class="row rowSubmit"> <span class="btn btn_search"><input type="submit" value="SEARCH" onClick="go_button();"></span>

        </div>

单击搜索按钮时如何显示具有相同位置的项目。我已经启动了 java 脚本,但无法前进。这是java脚本

<script type="text/javascript">
  function go_button(){
var loc=document.getElementByClassName('offer_miliage')[0].innerText;
if(document.getElementById('select').value==1){
//what to write to update .offer_list with .offer_item that
//have .offer_miliage text pallavaram
                            }

                        };
</script>

朋友你能告诉我这个脚本有什么问题吗

      function go_button(){
      if(document.getElementById('select').value==1){
    $(function() {
    $(".offer_item").search(function(a) {
        // Find the location name from element
        var priceAText = $(a).find(".offer_miliage").text();
        // Return the result
        if(priceAText=="Pallavaram"){return true;}
    }).each(function() {
     // Add all the elements back into the parent, in order
          $(this).appendTo(".offer_list");
        });
    });
}
    };
4

1 回答 1

0

您使用 jQuery 的工作示例:http: //jsfiddle.net/9VQRt/(用红色背景突出显示找到的数据)。

$('body').on('click', '.search_button', function() {
   var offerCollection = $('.offer_miliage');
    $.each(offerCollection, function(ind, val) {
        if($("#select option:selected").text() == val.innerHTML) {
            $(this).addClass('red_bg'); 
        }
    });
});
于 2013-07-26T09:06:33.760 回答