javascript简单的添加问题和答案多选题以及用php写的方法

最新推荐文章于 2025-04-07 17:57:31 发布

cdcdhj

最新推荐文章于 2025-04-07 17:57:31 发布

阅读量936

点赞数

分类专栏： javascript学习日记文章标签： javascript php

本文链接：https://blog.csdn.net/cdcdhj/article/details/121463408

版权

javascript学习日记专栏收录该内容

151 篇文章

订阅专栏

这个HTML代码段展示了一个用于添加问题和答案的表单。用户可以输入问题，并在文本区域中以*分隔的方式输入多个答案选项。当用户点击提交按钮时，JavaScript会动态创建包含问题和复选框答案的HTML元素并显示在页面上。代码还包含了一个未启用的PHP部分，似乎原本用于处理表单提交，但目前未被执行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<html>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<head>
<title></title>
</head>
<body>
<form name="form1" method="post" action="">
添加问题：<br><input type="text" name="question" /><br>
添加答案选项：<br><textarea name="content" cols="30" rows="5"></textarea>
<br/>
<span style="color:red;font-size:10px">答案之间请用*区隔</span>
<br>
<input type="button" name="submit" value="提交"/>
</form>

<?php
/*
if(@$_POST['submit']!=''){
	$question=$_POST['question'];
	$content=$_POST['content'];
	$data=explode("*",$content);
	echo "<div class='question'>问题：$question <br/>";
	while(list($name,$value)=each($data)){
		echo '<input type="checkbox" name="checkbox" value="'.$name.'">';
		echo $value."\n\t";
	}
	echo "</div>";
}
*/
?>

<script language="javascript">

var forms=document.forms[0];

var input=forms.elements['question'];
var content=forms.elements['content'];

var button=forms.elements['submit'];
var div=document.createElement("div");


button.onclick=function(){
		this.disabled=true;
	var inputvalue=input.value;
	var contentvalue=content.value;
	if(inputvalue != '' && contentvalue != ''){
		var title=document.createElement('h4');
		title.innerHTML="问题:"+inputvalue;
		div.appendChild(title);
		var re=contentvalue.split("*");
		for(var i in re){
			var checkbox=document.createElement('input');
			checkbox.type="checkbox";
			checkbox.name="checkbox";
			checkbox.value=i;
			var span=document.createElement('span');
				span.innerHTML=re[i];
			div.appendChild(checkbox);
			div.appendChild(span);
		}
		
		document.body.appendChild(div);
	}
	
	
}


</script>
</body>
</html>