0

所以我在表单中有一个范围输入：

javascript函数：

function mkString(id, pt, value, rw)
{
   var form = document.getElementById(id);
   var output = "Value is " + value;
   form.temp.value = output; //store correct "Value is X"
   form.submit();
}


<form id="percent" action="test.php" method="post" oninput="mkString('percent', 0, val.value, '1')">
    0<input id="val" type="range" min="0" max="100" value="0">100%
     <input name="temp" "type="hidden"> 
</form>

我需要它，以便当用户滑动范围时，它以这种格式“值是 X”提交给服务器，其中 X 是范围输入的值。如果可能的话，我希望它随着用户滑动条而改变值。截至目前，表单已提交，但它离开了页面。我不确定如何正确实现 jquery 以在不离开页面的情况下以“Value is X”格式提交到表单。谢谢！

4

2 回答 2

1

表单提交的唯一原因是您实际上是使用 javascript 提交的。
去掉form.submit();就不会再提交了，用ajax提交数据不用重新加载页面：

HTML

<form id="percent" action="test.php" method="post">
    0<input id="val" type="range" min="0" max="100" value="0" />100%
     <input name="temp" type="hidden" />  
</form>

JS

$('#val').on('change', function() {
    $.ajax({
        url : this.form.action,
        type: this.form.method,
        data: {val: this.value}
    });
});

可以在 test.php 中捕获$_POST['val'];

于 2013-09-09T23:26:28.233 回答
0

这应该有效：

$(function()
  {
      var form = $('#percent');

      form.submit(function(event)
      {
          event.preventDefault();

          form.find('input[name=temp]').val("Value is " + $('#val').val());

          $.post('test.php', form.serialize(), function(response)
          {
              // do something here with the response from the server if you need to
          });
      });
  });
于 2013-09-09T23:28:22.517 回答