Question

我有这个简单的html页面：

<html>
    <head>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function () {
         $(document).on('click', 'button', function(){
             var selectval = $('select').val();
             $.get('/',
             {
                  selectval: selectval
             });
         });
    });
    </script>
    </head>

    <body>
    <select>
         <option value="Option1">Option1</option>
         <option value="Option2">Option2</option>
    </select>

    <button>Submit</button>
    </body>
</html>

我希望按钮在表单上的提交按钮就像get方法一样。因此，单击该按钮应将get变量（selectval）作为查询字符串提交。

所以点击按钮应该转到：

http://domain.com/?selectval=option1

有没有办法在没有包装成表格的情况下这样做？

Answer 1

尝试使用javascript：

<script type="text/javascript">
    $(document).ready(function () {
         $(document).on('click', 'button', function(){
             var selectval = $('select').val();
             location.href = "?selectval="+selectval;
         });
    });
    </script>

Answer 2

你可以做到这一点，完全有效。您可以尝试以下方法来执行此操作。注意我已使用ID作为必需元素。

<html>
    <head>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function () {
         $('#btn').click( function(){
             var selectval = $('#opt').val();
             $.get('/',
             {
                  selectval: selectval
             },function(data){
                 alert(data);
             });
         });
    });
    </script>
    </head>

    <body>
    <select id="opt">
         <option value="Option1">Option1</option>
         <option value="Option2">Option2</option>
    </select>

    <button id="btn">Submit</button>
    </body>
</html>

Fiddle Here

jquery提交没有表单的url查询字符串

2 个答案: