php 如何将 <div> 作为表单 <input> 处理
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/15538225/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I process a <div> as a form <input>
提问by Jeight
What I've done is:
我所做的是：
HTML
HTML
<form>
<div id="textBox" contenteditable="true" name="textBox"><?php echo $storyText; ?>
</div>
<textarea id="hiddeninput" name="hiddeninput"></textarea>
<input type="submit" id="save" name="save" value="Submit"/>
</form>
Javascript
Javascript
$('#save').click(function () {
var mysave = $('#textBox').html();
$('#hiddeninput').val(mysave);
$("form:first").submit();
$('#hiddeninput').append(mysave);
alert($('#hiddeninput').val());
});
So both the alert and the append display the correct information, but it won't save #hiddeninput as a php variable when I submit. Originally I had this as an hidden input method, but I'm trying to show that it won't post no matter what I do,
所以警报和附加都显示了正确的信息，但是当我提交时它不会将#hiddeninput 保存为 php 变量。最初我将此作为隐藏的输入法，但我试图表明无论我做什么它都不会发布，
回答by peterm
Your code is working almost as it is.
But I'd rather use normal <input type="hidden">and you don't need to trigger submitfor your form in your case just put the value in a hidden field.
您的代码几乎按原样运行。但是我宁愿使用 normal<input type="hidden">并且您不需要submit在您的情况下为您的表单触发，只需将值放在隐藏字段中即可。
Given your markup, with slight modifications
鉴于您的标记，稍作修改
<form action="showrequest.php">
<div id="textBox" contenteditable="true" name="textBox" style="width:300px;height:100px;">
</div>
<textarea id="hiddeninput" name="hiddeninput"></textarea>
<input type="submit" id="save" name="save" value="Submit"/>
</form>
js
js
$(function(){
$('#save').click(function () {
var mysave = $('#textBox').html();
$('#hiddeninput').val(mysave);
});
});
var_dump($_REQUEST)on php side gives
var_dump($_REQUEST)在 php 端给出
array(2) {
["hiddeninput"]=>
string(4) "test"
["save"]=>
string(6) "Submit"
}
回答by Jesse Lee
Try binding the submit event instead of the click event. What might be happending is the form is submitting before the value of your textarea is set.
尝试绑定提交事件而不是点击事件。可能发生的情况是表单在设置 textarea 的值之前提交。
$('form').submit(function(){
var mysave = $('#textBox').html();
$('#hiddeninput').val(mysave);
});
I tested this example with method="get" and got the html from the div to show up in the URL.
我用 method="get" 测试了这个例子，并从 div 中获取了 html 以显示在 URL 中。
回答by bfavaretto
I believe your form is being submitted before your js code has a chance to run. Since you're submitting manually from jQuery, try preventing the default event of the button (which also submits the form):
我相信您的表单是在您的 js 代码有机会运行之前提交的。由于您是从 jQuery 手动提交的，请尝试阻止按钮的默认事件（也提交表单）：
$('#save').click(function(e) {
e.preventDefault();
var mysave = $('#textBox').html();
$('#hiddeninput').val(mysave);
$("form:first").submit();
});
回答by Julian H. Lam
Speaking only from experience, you can't submit a divvalue in a form POST.
仅从经验上讲，您不能div在表单中提交值POST。
You can change it to a textarea, and if you want to restrict users from editing it, set it to disabled.
您可以将其更改为 textarea，如果您想限制用户对其进行编辑，请将其设置为disabled.
Alternatively, you can use javascript to submit the form, and pull the value from #hiddeninputthat way.
或者，您可以使用 javascript 提交表单，然后以#hiddeninput这种方式提取值。
回答by gordon
Here's a generic way to submit any div content elements you want (see notes below):
这是提交您想要的任何 div 内容元素的通用方法（请参阅下面的注释）：
<form method="post" id="f">
<div id="txt" addToForm="f" contenteditable spellcheck="true" style="height:100px;width:300px;font-family:arial,sans serif;border:1px solid black;font-weight:normal;overflow-y:auto;"
></div><br />
<input type="button" value="Go" id="btnGo">
</form>
<script type="text/javascript">
$(document).ready(function(){
$("#btnGo").click(function(){
$("div[addToForm]").each(function(){
var tId=$(this).prop("id");
$(this).after("<input type='hidden' name='"+tId+"' id='hdn"+tId+"'>");
$("#hdn"+tId).val($(this).html());
});
("#f").submit();
});
});
</script>
Note 1) using <input type="hidden">preserves any formatting (IE11 allows more than FF). If you'd rather strip all formatting out, including CFLFs (i.e., <br>'s) from users hitting Enter/Return, use <textarea style="display:none;"></textarea>instead.
Note 2) be sure validation is successfully complete first or you will end up with multiple inputs with the same names.
注 1) using<input type="hidden">保留任何格式（IE11 允许超过 FF）。如果您希望删除所有格式，包括<br>用户按 Enter/Return 的CFLF（即's），请<textarea style="display:none;"></textarea>改用。注 2) 确保首先成功完成验证，否则您将得到多个具有相同名称的输入。
