Question

我有一个页面，它将来自不同文件(content.php)的内容加载到div中，并每5秒重新加载一次。在content.php文件中，我使用的是一个表单（没有javascript的简单HTML）。当我直接访问文件(example.com/content.php)时，表单有效，但是当我用ajax将其加载到不同页面的div中时，我无法单击该按钮。当文件加载到div中时，如何修改按钮可单击的表单？

这是content.php中的表格：

echo ("<form action='submit.php' method='GET'>");
echo ("<input type='hidden' name = 'value' value = '".$value1."'>");
echo ("<input type='hidden' name = 'value2' value = '".$value2."'>");
echo ("<button class='button-1' type='submit'>".$button_text."</button></form>");`

此表单代码位于for循环中，因此有几个按钮。

Answer 1

根据我对您的问题的理解，您正在使用ajax将页面从contact.php页面加载到其他页面并且工作正常。但是，单击第二页中创建的表单上的“提交”按钮并不执行任何操作？

您是否尝试过将onclick事件分配给提交和控制台记录数据？如果您在chrome中进行测试，是否会在inspect元素中弹出错误？

您是将PHP响应作为JSON传递还是只是回显所有输入元素？我假设通过如下所示回显元素来传递表单：

＆＃13;

echo "<input type='submit' value='Submit'/>";

＆＃13;

你可以试试你的php

＆＃13;

echo "<input type='submit' value='Submit' onclick='testFunc()'/>";

＆＃13;

并在你的javascript中创建函数：

＆＃13;

function testFunc() {
  alert('Submit button clicked');

  //log whatever input values you want passed to the server replace sampleInput1 with whatever id you are using for the inputs
  console.log(document.getElementById('sampleInput1').value);


}

＆＃13;

如果警报弹出并且输入日志正常，那么只需创建另一个ajax调用即可提交表单，如果您想留在该页面上。或者，检查<form>标记的操作和方法是什么？

在重新阅读您的代码后，可以将id='hidVal1'和id='hidVal2'添加到隐藏的输入中，如下所示：

＆＃13;

    echo("<input type='hidden' id='hidVal1' name = 'value' value = '".$value1.
      "'>");
    echo("<input type='hidden' id='hidVal2' name = 'value2' value = '".$value2.
      "'>");

＆＃13;

我假设您知道如何制作ajax函数，因此要创建要发送的值，请使用我建议的testFunc()，并将其设为：

＆＃13;

function testFunc() {
  alert('Submit button clicked');
  var hidVal1 = document.getElementById('hidVal1').value;
  var hidVal2 = document.getElementById('hidVal2').value;

  //log for testing
  console.log("value of hidden 1 " + hidVal1 + "value of hidden 2 " + hidVal2);

  //url for ajax
  var url = "submit.php?hidVal1=" + hidVal1 "&hidVal2="+
  hidVal2;

  //call to ajax function

}

＆＃13;

ajax加载内容中的表单不起作用

1 个答案: