Question

我正在学习它，但我无法找到这里的错误！我希望div2从div1中的表单中获取数据，称为公式。我想知道选择了哪个项目以及点击了哪个按钮。

主html文件：

<script src="utils/Scripts/prototype.js" type="text/javascript"></script>
<script type="text/javascript">

function sendf(formul, divi, php)
    {
     var params = Form.serialize($(formul));                    
     new Ajax.Updater(divi, php, {method: 'post', parameters: params, asynchronous:true});
    }
</script>

</head>

<body>
<div id="div1"> 
contenido div1
<form id="formulario" method="POST">
<select size="3" id="lista" onchange="sendf('formulario', 'div2', 'prodiv1.php');"> 
<option>elemento 1</option>
<option>elemento 2</option>
<option>elemento 3</option>
</select>
<input type="button" id="b1" value="bot1" onclick="sendf('formulario', 'div2', 'prodiv1.php');" />
<input type="button" id="b2" value="bot2" onclick="sendf('formulario', 'div2', 'prodiv1.php');" />
</form>


<div id="div2" style="background: blue;"> 
contenido div2
</div>
</div>
</body>
</html>

php文件，prodiv1.php：

<?
echo 'exec: prodiv1.php<br>';
print_r($_POST);
echo serialize($_POST);

if (isset($_POST))
    {
    foreach ($_POST as $key=>$value)
        {
        echo $key.'=>'.$value."<br>";
        }
    }


echo "select: ".$_POST['lista'];

if (isset($_POST['b1'])) {echo 'click: boton1';} else {echo 'click: boton2';}
?>

我已经尝试了很多东西，并且看到它可以通过事件观察者，httprequests等完成，但我需要的是非常简单的，并且可能有一种优雅的方法来解决它... 我提前感谢任何帮助！祝你今天愉快。纪莲

Answer 1

如果您不需要以某种方式实际处理表单内容，则无需使用Ajax传递给PHP脚本。根据你想要在div 2中显示的内容，你可以做一些简单的事情：

function sendf()
{
 var listvar = $('lista').value;
 $('div2').update('select menu value was ' + listvar);
}

这显然缺少很多细节，可以大量改进，但它应该突出显示不需要AJAX的事实。

Answer 2

编辑查看您发布的其余代码，AJAX真的需要吗？当然你只是用页面上已经存在的数据来更新现有页面，服务器在这方面没有真正的部分可用吗？

很抱歉再次深入了解jQuery，但这应该允许您在没有ajax请求的情况下将值输入“div2”。

    $(document).ready(function() {
        $("input").click(function(e) {
            $("#div2").html($(this).attr("id")+" clicked<br />");
            updateList();
        });
    });
    function updateList() {
       $("#div2").append($("#lista").val() + " selected");
    }

简单地说，这段代码说“如果单击一个输入元素，用输入变量id更新div2的值，并将列表中的选定值附加到结果”。希望这对你有意义:)）

如果您需要一种简单，优雅的方法来使用AJAX解决此问题，请使用jQuery库的ajax和post方法。有关详细信息，请查看here，它将显着减少代码的大小和复杂性。

用不同的按钮原型ajax updater div

2 个答案: