在这里，我在 jQuery 中使用拖放。
我从数组中的数据库（文章->问题，文章->答案）中获取一组问题和一组答案，其中答案被拖放到问题文本框中。在刷新页面时，拖动的值会到达原始位置，而不是在我丢弃的特定文本框中。
这里我的编码。
<html>
<head>
<meta charset="utf-8" />
<title>jQuery UI Draggable - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery- ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<!--<link rel="stylesheet" href="/resources/demos/style.css" /> -->
<style>
/*#draggable { width: 50px; height: 20px; padding: 0.5em; } */
.drag_ans {
background: none repeat scroll 0 0 transparent;
border: 0 none;
width: 100px;
}
#draggable {
width: 50px;
height: 20px;
background: white;
}
#droppable {
float: left;
margin: 50px;
width: 500px;
height: 300px;
border: green;
}
#ques {
background: none repeat scroll 0 0 #FFFFFF;
padding: 10px;
width: 100px;
}
</style>
<script>
$(document).ready(function(){
$("#answer").click(function(){
// alert('find a score');
});
});
</script>
</head>
<body>
<div class="container_inner">
<?php
foreach($data as $article)
{
echo "<p>";
echo "<b>";echo $article->article_name;
echo"</b>";
echo "</p>";
echo "<p>";
echo $article->description;
echo "</p>";
echo $article->video; echo "<br>";
}
?>
<?php
$add=1;
foreach($question as $article)
{
?>
<!-- <div id="drop"> -->
<p>
<?php echo $article->question; ?>
<input type ="text" id="ques_<?php echo $add; ?>" name="" class="ui-widget-content" />
</p>
<!--</div> -->
<?php
$add++;
}
?>
<?php
$counter=1;
foreach($question as $article)
{
?>
<script>
$(function() {
$("#draggable_<?php echo $counter; ?>").draggable({ revert: 'invalid' });
$("#ques_<?php echo $counter; ?>").droppable({
drop: function( event, ui ) {
$(this).addClass( "ui-state-highlight" ).find( "p" ).html( "Dropped!" );
}
});
});
</script>
<div id="draggable_<?php echo $counter; ?>" class="ui-widget-content drag_ans">
<p>
<?php echo $article->answer; ?>
</div>
</p>
<?php
$counter++;
}
?>
<p> <input class="green_but" type="submit" name="NEW_SUBMIT" value="Submit" id="answer"/> </p>
</div>
</body>
</html>
拖放工作正常，刷新问题文本框中的页面值全部为空。如何在 jquery 中验证问题和答案，因为该答案应在删除问题文本框后存储在 DB 中。并且当点击提交按钮时，如果问题回答错误，分数应该减少。例如：如果用户回答设置正确答案 4 分，满分 10 分，那么分数应该是 4 分（满分 10 分）。