php - AJAX/JS/PHP : Submitting value of a select box without page refresh or button click

标签 php javascript jquery ajax

我目前正在使用 Ajax 提交输入字段,无需刷新页面或单击按钮。该函数适用于文本输入字段,但不适用于发布选择框的值,然后 php 回显结果。我检查了 firebug 工具,发现 Ajax/js 函数没有发布任何内容。

如何提交选择框的值,以便我可以与 php 进行回显? EXAMPLE

JS

<script>
$(document).ready(function() {
        var timer = null; 
        var dataString;   
          function submitForm(){
                         $.ajax({ type: "POST",
                         url: "index.php",
                         data: dataString,
                         success: function(result){
                         $('#item_input').text( $('#resultval', result).html()); 
                             }
                            });
                            return false;
           }
             $('#item_name').on('keyup', function() {
             clearTimeout(timer);
             timer = setTimeout(submitForm, 050);
             var name = $("#item_name").val();
             dataString = 'name='+ name;
          });
 }); 
</script>

PHP

<?php
      if ($_POST)
                {
                  $item_name     = $_POST['name'];
                  echo ('<div id="item_input"><span id="resultval">'.$item_name.'</span></div>');
                }
?>

HTML

<html>
<form method="post" id="form" name="form">  
<select name="item_name" value="<? $item_name ?>" size="4" id="item_name">
     <option value="">Item1</option>
     <option value="">Item2</option>
     <option value="">Item3</option>
     <option value="">Item4</option>
</select>
</form>
<div id="item_input"></div>
</html>

最佳答案

select 标签不会触发 keyup 事件,您应该使用 change 代替,尝试以下操作:

 $('#item_name').on('change', function() {
     clearTimeout(timer);
     var name = $(this).val();
     dataString = 'name='+ name;
     timer = setTimeout(submitForm, 050);
 });

 $('#item_input').html(result); 

关于php - AJAX/JS/PHP : Submitting value of a select box without page refresh or button click,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11588831/

相关文章:

php - 如何在 PHP 中显示从 MySQL 获取的选定行时设置自定义顺序

php - 使用 .htaccess 文件时出现 "Internal Server Error 500"

javascript - 使用 javascript 异步加载时,我该如何替换 document.write ?

javascript - Firestore如何用作队列?

javascript - 如何通过 mqtt.js 连接到 ec2 上的 mqtt 代理?

jquery - 为什么 jQuery 中的 'change' 事件不会在 ReactJS 中触发 onChange?

php - json_decode() 在不同的环境下返回不同的值

php - 为什么 mysql_query() 使用 SELECT 语句返回 TRUE?

javascript - Jquery 图形框

javascript - 如何将多项选择中选定的元素插入到输入中?