Web 如何使用按钮更改选项值并将数据发送到url？

我有这卷菜单：

<form class="woocommerce-ordering" method="get">
<select name="orderby" class="orderby">
<option value="menu_order" >Default sorting</option>
<option value="popularity"  selected='selected'>Sort by popularity</option>
<option value="rating" >Sort by average rating</option>
<option value="date" >Sort by newness</option>
<option value="price" >Sort by price: low to high</option>
<option value="price-desc" >Sort by price: high to low</option>    
</select>
<input type="hidden" name="attest" value="true" /></form>

默认排序
按受欢迎程度排序
按平均评级排序
按新鲜度排序
按价格排序：从低到高
按价格排序：从高到低

我需要它使用按钮来改变值。如何仅通过使用按钮将数据发送到url，例如“按价格排序：从低到高”

---

谢谢大家!

如果您想要真正的提交按钮，可以使用

<input type="submit" name="orderby[menu_order]" value="Default sorting">
<input type="submit" name="orderby[popularity]" value="Sort by popularity">

---

但是请注意，在较旧的浏览器中支持此功能（特别是IE不确定这是否是您的意思，但如果您希望在用户单击下拉菜单中的某个选项后立即更新数据，此jquery代码将起到以下作用：

$('.orderby').change(function() {
    var value = $(this).val();

    alert(value);

    /*
    Run ajax here to make a call to a php script that
    takes the value parameter and returns the data in
    the correct order
    */
});

---

按价格排序后，我的url应如下所示：

<a href="?orderby=price&attest=true">Sort by price: low to high</a>

$('.orderby').change(function() {
    var value = $(this).val();

    alert(value);

    /*
    Run ajax here to make a call to a php script that
    takes the value parameter and returns the data in
    the correct order
    */
});