Değişen arama değeri javascript aracılığıyla

Question

dün burada bir konuyu Wordpress - How to change search value using a drop down selector?

oluşturulan ve ben Fredrik yardımı ile figuret ama bir süre sonra benim fikrim değişti ve giriş içeride iyi değildi çünkü ben biraz oluşturulan daha select kaldırıldı müthiş simgeleri artık wich yazı tipini kullanarak bağlantılar daha iyi bakıyor

Benim Nihai Arama şeklidir

<div class="searchbox"> 
<form action="<?php echo home_url('/'); ?>" method="get"><button name="search" class="btn"> 
<span></span></button> 
<input type="text" id="s" name="s" value="" /> 

<input type="hidden" name="post_type" value="post" /> 

<div class="select_search"> 

<span class="wrs"> 
<i class="fa fa-video-camera" id="search_type_icon"></i> 
<i class="fa fa-caret-down"></i> 
</span> 

<div class="drop_search"> 
<span data-searchtype="photos"> 
<i class="fa fa-picture-o"></i> 
</span> 
</div> 

</div> 

</form> 
</div> 

ve Benim HB

"=

hiçbir şey benim için :) onun ayıp çalıştı ama saatlerce ve ben

istediğiniz gibi ben değerini değerine = "post" değiştirmek istediğiniz resim ikonuna tıkladığınızda bunu çözemiyorum galeri "fotoğraf simgesine tıkladığımda hiçbir şey olmuyor.

Benim css

.select_search { 
position:absolute; 
right: 40px; 
z-index:10; 
display:inline-block; 
width:58px; 
height:31px; 
cursor:pointer; 
vertical-align:middle; 
} 

.select_search .wrs { 
position:relative; 
z-index:11; 
display:block; 
height:29px; 
text-align:center; 
} 

.select_search:hover .wrs { 
} 


.fa-caret-down { 
position:absolute; 
top:6px; 
right:7px; 
width:7px; 
height:4px; 
-webkit-transition:0 .4s ease-in-out; 
-moz-transition:0 .4s ease-in-out; 
-o-transition:0 .4s ease-in-out; 
transition:transform .4s ease-in-out; 
background-position:-300px 0; 
} 

.drop_search { 
position:absolute; 
z-index:10; 
top:26px; 
left:0; 
display:none; 
width:58px; 
text-align:center; 
} 

.drop_search span { 
display:block; 
padding:0 0 4px; 
} 

.select_search:hover .drop_search { 
display:block; 
} 
.select_search:hover .fa-caret-down { 
-webkit-transform:rotateZ(-180deg); 
-moz-transform:rotateZ(-180deg); 
transform:rotateZ(-180deg); 
position:absolute; 
top:16px; 
right:7px; 
width:7px; 
height:4px; 
} 

.fa-video-camera { 
width:20px; 
height:14px; 
margin:6px 5px 0 0; 
} 

.fa-picture-o { 
width:20px; 
height:14px; 
margin:6px 5px 0 0; 
} 

edit tüm html

<div class="searchbox"> 
<form action="<?php echo home_url('/'); ?>" method="get"><button name="search" type="submit" class="btn"> 
<span></span></button> 
<input type="text" id="s" name="s" value="" /> 

<input type="hidden" id="#search_type" name="post_type" value="post" /> 

<div class="select_search"> 

<span class="wrs"> 
<i class="fa fa-video-camera" id="search_type_icon"></i> 
<i class="fa fa-caret-down"></i> 
</span> 

<div class="drop_search"> 
<span data-searchtype="photos"> 
<i class="fa fa-picture-o"></i> 
</span> 
</div> 

</div> 
</form> 
</div> 
<script type="text/javascript"> 
function SearchPostValue(e) { 
e.preventDefault(); 
var t = $(this); 
var searchtype = t.attr('data-searchtype'); 
if (searchtype == 'post') { 
$('#search_type_icon').removeClass('fa fa-picture-o').addClass('fa fa-video-camera'); 
$('[data-searchtype]').attr('data-searchtype', 'gallery').find('i').removeClass('fa fa-video-camera').addClass('fa fa-picture-o'); 
} else { 
$('#search_type_icon').removeClass('fa fa-video-camera').addClass('fa fa-picture-o'); 
$('[data-searchtype]').attr('data-searchtype', 'post').find('i').removeClass('fa fa-picture-o').addClass('fa fa-video-camera'); 
} 
$('.searchbox #search_type').attr('value', searchtype); 
} 
$(document).ready(function(){ 
$('.searchbox .drop_search [data-searchtype]').click(SearchPostValue); 
}); 
</script> 

Answer 1

Sen, böylece alışkanlık çalışmalarını sağladığınız html hayır '#searchform #search_type' öğesi var. <input type="hidden" name="post_type" value="post" /> öğenize bu kimliği ekleyin (search_type).

ve bunun yerine .attr ('değer', newValue) ile değişen sadece menuSearchClick (e) işlevi çalıştırılır olmadığını gelince

$('#search_type').val(newValue); 

kullanabilirsiniz, siz (bir uyarı ile kontrol etmelidir) veya console.log ("check"). bu işlevin içinde. Bu günlükler/uyarılar görünmezse, simge divunuza bir onclick = "menuSearchClick()" ekleyebilirsiniz.