jquery로 span의 text를 변경하는 부분에서 질문드립니다.
본문
일단 현제 제가 작업하고 있는 사이트는
http://risette.sitecook.kr/ab-1158
여기 입니다.
위 사이트의 검색 select중 보증금을 클릭하면 드롭다운 메뉴가 나오고
금액을 클릭하면 input과 최상위 메뉴 보증금(0원~0원) 부분에 클릭한 td의 rel이 적용이
되어야 하는데요 작업한 소스는 아래와 같습니다.
스크립트
<script type="text/javascript">
/*통합검색 설정메뉴 js*/
$(function(){
$('div.nice_head_menu ul li span').click(function () {
$(this).toggleClass('up');
$(this).next('div.sub_menu').toggleClass('active');
$(this).parent().siblings().find('span').removeClass('up');
$(this).parent().siblings().find('div.sub_menu').removeClass('active');
});
})
$(document).ready(function(){
$(".nice_head_op").click(function(){
//$(".nice_head_mn").show();
$(".nice_head_xx").show();
$(".nice_head_op").hide();
$(".nice_head_mn").css({"height":"auto"});
$(".nice_head_mn > p").show();
$(".nice_head_mn > table").show();
});
$(".nice_head_xx").click(function(){
//$(".nice_head_mn").hide();
$(".nice_head_xx").hide();
$(".nice_head_op").show();
$(".nice_head_mn").css({"height":"23px"});
$(".nice_head_mn > p").hide();
$(".nice_head_mn > table").hide();
});
});
</script>
<script type="text/javascript">
$(function(){
$('table.estate_range td').on('click', function(){
var $menu_name = $(this).parents('div.menu_name');
var $menu_down = $(this).parents('div.menu_down');
var $menu_value = $(this).attr('rel');
if($(this).index() > 0){
$menu_down.find('input').last().val($menu_value).trigger('blur').trigger('change');
$menu_name.find('span.estate_sell_price strong').last().html($menu_value).trigger('blur').trigger('change');
$menu_name.find('span.estate_sell_price1 strong').last().html($menu_value).trigger('blur').trigger('change');
} else{
$menu_down.find('input').first().val($menu_value).trigger('blur').trigger('change');
$menu_down.find('span.estate_sell_price strong').first().html($menu_value).trigger('blur').trigger('change');
$menu_down.find('span.estate_sell_price1 strong').first().html($menu_value).trigger('blur').trigger('change');
// $('.menu_down').hide();
}
});
})
</script>
html부분
<div style="display:inline-block; vertical-align:top;position:relative;z-index:10000000;" class="nice_head_mn menu_down">
<div class="nice_head_op menu_name" rel="만원" style="background:#fff; line-height:25px;">보증금<span class="estate_sell_price1">(<strong>0</strong>만원~<strong>0</strong>만원)</span> ▼</div>
<div class="nice_head_xx menu_name" rel="만원" style="background:#fff; line-height:25px;">보증금<span class="estate_sell_price">(<strong>0</strong>만원~<strong>0</strong>만원)</span> ▲</div>
<p><input type="text" name="estate_deposit_min"> 만원 ~ <input type="text" name="estate_deposit_max"> 만원
</p>
<table class="estate_range">
<tbody>
<tr>
<td rel="0">0만원</td>
<td rel="0">0만원</td>
</tr>
<tr>
<td rel="100">100만원</td>
<td rel="100">100만원</td>
</tr>
<tr>
<td rel="500">500만원</td>
<td rel="500">500만원</td>
</tr>
<tr>
<td rel="1000">1,000만원</td>
<td rel="1000">1,000만원</td>
</tr>
<tr>
<td rel="2000">2,000만원</td>
<td rel="2000">2,000만원</td>
</tr>
<tr>
<td rel="3000">3,000만원</td>
<td rel="3000">3,000만원</td>
</tr>
<tr>
<td rel="4000">4,000만원</td>
<td rel="4000">4,000만원</td>
</tr>
<tr>
<td rel="5000">5,000만원</td>
<td rel="5000">5,000만원</td>
</tr>
<tr>
<td rel="6000">6,000만원</td>
<td rel="6000">6,000만원</td>
</tr>
<tr>
<td rel="7000">7,000만원</td>
<td rel="7000">7,000만원</td>
</tr>
<tr>
<td rel="8000">8,000만원</td>
<td rel="8000">8,000만원</td>
</tr>
<tr>
<td rel="9000">9,000만원</td>
<td rel="9000">9,000만원</td>
</tr>
<tr>
<td rel="10000">10,000만원</td>
<td rel="10000">10,000만원</td>
</tr>
<tr>
<td rel="30000">30,000만원</td>
<td rel="30000">30,000만원</td>
</tr>
<tr>
<td rel="50000">50,000만원</td>
<td rel="50000">50,000만원</td>
</tr>
<tr>
<td rel="">무제한</td>
<td rel="">무제한</td>
</tr>
</tbody>
</table>
</div>
문제는 보증금(0원~0원) 중에 앞에 0원에는 클릭한 값이 적용이되는데 뒤의 0원은 적용이 되질 않고 있습니다.....이것때문에 오늘 하루종일 고생이네요;;;;;;
방법 좀 알려주세요..ㅠㅠ
!-->!-->답변 1
$(function() {
$(".estate_range td").on("click", function() {
$("span.estate_sell_price strong:eq(" + $(this).index() + ")").text($(this).attr("rel"));
$("input[name^='estate_deposit']:eq(" + $(this).index() + ")").val($(this).attr("rel"));
});
});
답변을 작성하시기 전에 로그인 해주세요.