Question

<form action="" method="post">
    <div id="MG_TextBox" contenteditable="true" name="textBox1" style="width:600px;height:400px; background-color:#ECCBCB;"> Hello</div>
    <input type="hidden" name="hiddeninput" id="MH_Hiddeninput" >
    <input type="submit" id="MG_Submit" name="submit" value="Submit"/>
    </form>

和ajax

<script>
$(function(){
    $('#MG_Submit').click(function () {
        var MG_Text = $('#MG_TextBox').html();
        $('#MG_Hiddeninput').val(MG_Text);
        return true;
    });
});
</script>

然后php

<?
    if ($_POST['hiddeninput'])  {
        print $_POST['hiddeninput'];
        }
?>

我想将DIV内容转移到HIDDEN INPUT。随后PHP将它们打印在同一页面上。即。 action =“”

我做错了什么？

版本2.仍无法正常工作

<?
if ($_POST['hiddeninput'])  { print $_POST['hiddeninput']; }
?>

<html>
<head> 
<script>
$(function(){
    $('#MG_Form').on("submit", function (e) {
        var MG_Text = $('#MG_TextBox').html();
        $('#MG_Hiddeninput').val(MG_Text);
        e.preventDefault();
    });
});
</script>
</head>

<body>
  <form action="" method="post" id="MG_Form" enctype="multipart/form-data">
    <div id="MG_TextBox" contenteditable="true" name="textBox1" style="width:300px;height:200px; background-color:
    #9AB5BF;"> Hello</div>
    <input type="hidden" name="hiddeninput" id="MG_Hiddeninput" >
    <input type="submit" id="MG_Submit" name="submit" value="Submit"/>
  </form>
</body>
</html>

Answer 1

试试这个，你不希望表单提交，你想要激活AJAX。这样做是为了阻止点击进行默认行为 - 这将提交表单;

<script>
$(function(){
    $('form').on("submit", function (e) {
        var MG_Text = $('#MG_TextBox').html();
        $('#MG_Hiddeninput').val(MG_Text);
        e.preventDefault();
    });
});
</script>

您可能希望在表单中添加id，以便$('form')选择器更加具体。因为这可能会打破页面上的其他表单。

Answer 2

对于初学者，你试图选择一个不存在的元素（MG_Hiddeninput）。改为：

<script>
$(function(){
    $('#MG_Submit').click(function () {
        var MG_Text = $('#MG_TextBox').html();
        $('#MH_Hiddeninput').val(MG_Text);
        e.preventDefault(); 
        return true;
    });
});
</script>

或更改隐藏输入的ID以匹配您的选择器。

<input type="hidden" name="hiddeninput" id="MG_Hiddeninput" >

还添加e.preventDefault（）以防止发布表单。你提到ajax但我在这里看不到任何动作。

DIV在表单中并将它们发布在同一页面上

2 个答案: