Question

所以我有一个下拉菜单，其中包含＆＃39;下一步＆＃39;和＆＃39; Prev＆＃39; （上一个）按钮。我想这样按下一个或上一个它也会提交下拉选项。

<input type="button" id="change2" value="prev" />
<select id="Questions">
  <option value="QA">QUESTION A</option>
  <option value="QB">QUESTION B</option>
  <option value="QC">QUESTION C</option>
  <option value="QD">QUESTION D</option>
</select>
<input type="button" id="change" value="next" />

这是JQuery for it：

$(window).load(function(){
    var dd = $('#Questions'),
        max_len = dd.find('option').length;

    $('#change').click(function () {
        var x = dd.find('option:selected').index();
        if (max_len == x + 1) {
            x = -1;
        }
        dd.find('option').eq(x + 1).prop('selected', true);
    });
    $('#change2').click(function () {
        var x = dd.find('option:selected').index();
            if (max_len == x + 1) {
                x = -1;
            }
        dd.find('option').eq(x - 1).prop('selected', true);
    })
});

我怎样才能这样做，当我点击下一个或上一个时它也会提交表格？

由于

Answer 1

您可以使用$.ajax();。

非常通用的解决方案可能如下所示：

$(document).ready(function() {
    $("#change, #change2").on('change', function(){
        $.ajax({
            url: 'sendTheDataHere',
            type: 'POST',
            data:  {keyname:$('#Questions option:selected').val()},
            success: function () {},
            error: function () {}
        });
    });
});

Answer 2

您可以使用jQuery提交表单。有关详细信息，请查看this question上的最佳答案。假设您在表单上设置了action属性，则可能只需要这样的内容：

$('#change').click(function () {
    // your other logic here
    $('form').submit();
});

Answer 3

<input type="button" id="change2" value="prev" onclick="changeS()"/>
<select id="Questions">
  <option value="QA">QUESTION A</option>
  <option value="QB">QUESTION B</option>
  <option value="QC">QUESTION C</option>
  <option value="QD">QUESTION D</option>
</select>
<input type="button" id="change" value="next" onclick="changeS()"/>

JS代码

<script>
function changeS() {
/* document.getElementById('change').getElementsByTagName('option')[1].selected = true;*/
var r=document.getElementById('change').selectedIndex+1;
document.getElementById('change').getElementsByTagName('option')[r].selected = true;
}
</script>

更改所选选项后提交下拉表单

3 个答案: