2016-03-31 6 views
-1

1つのオプションを選択してgoボタンをクリックすると、URLをリダイレクトしたいのですが、ボタンをリダイレクトする方法はありますか?同じURLでボタンをリダイレクトします。どのように私は送信ボタンでドロップダウンをリダイレクトすることができます

<?php 
global $wpdb; 
echo "hello"; 
// $sql="SELECT path FROM `grillM_blogs` WHERE blog_id"; 
    $sql="SELECT * FROM grillM_blogs"; 
$results = $wpdb->get_results($sql); 
//print_r($results); 
?> 
<form id="search_mini_form"> 
<select class="mypopup" id="websites"> 
     <option>select location</option> 
<?php 
foreach($results as $res) { 
    $newstring = str_replace("/"," ",$res->path); 
    $newstring=ucwords($newstring); 
    ?> 
     <option value="<?php echo $res->path;?>"><?php echo $newstring;?></option> 
     <?php } ?> 
     </select> 
     <button class="go">Go</button> 
<a href='' class='close'>Skip</a> 

</div> 
</div> 
</form> 
<script> 
$(document).ready(function(){ 
    $(".go").change(function(){ 
      var go_to_url = $("#website").find("option:selected").val(); 
      window.location = go_to_url 
      // alert("hello");  
}); 
}); 
</script> 
+0

私はあなたの代わりに.changeイベントの.clickイベントを使うべきだと思います。 –

答えて

0

最初の提案は、単にのonchangeイベントは、ボタンのクリックを必要とせずに、ロケーションのhrefを変更させることであろうが、あなたは、あなたがそれ<a>リンクにし、その後でできた、ボタンを「行く」保持する場合jsには、リンクのhrefを変更するselectリストのonchange関数があります。私はブートストラップを使用してボタンへのリンクのスタイルを設定していますが、他の方法で行うこともできます。私もあなたが持っていたコードをカットし、この例のためにちょうどphpを失って、 "go"リンクhrefの動的変化を表示します(googleか、選択に応じてso)。選択を変更してからgoボタンをマウスでクリックすると、新しいhrefが表示されます。

$(function() 
 
\t { 
 
\t \t $('#websites').on('change',function(){ 
 
\t \t var loc=$(this).val(); 
 
\t \t $('.go').attr('href',loc); 
 
\t \t }) 
 
\t })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <title>Select Demo</title> 
 
\t <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> 
 
</head> 
 
<body> 
 
\t <select class="mypopup" id="websites"> 
 
     <option>select location</option> 
 
     <option value="https://www.google.com.au/?gws_rd=ssl">Google</option> 
 
     <option value="http://stackoverflow.com/">Stack Overflow</option> 
 
     </select> 
 
\t \t 
 
     <a href="#" class="button go btn btn-success btn-xs">Go</a> 
 
\t \t <a href='' class='close'>Skip</a> 
 

 
\t <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 
 

 
</body> 
 
</html>

関連する問題