我要做的事情:
我正在编写一个脚本,旨在为用户提供选择,并根据他们做出的选择,提出一个新的选择。为此,我制作了两个脚本,一个用于HTML和页面结构,另一个用于PHP(从服务器获取信息)和JavaScript(构建生成的选项)。
然后我使用AJAX在这两个脚本之间进行通信,或者至少,这是我试图做的,但我对AJAX非常陌生,我无法使其工作。
当按下3个按钮中的一个时,我正试图从页面传递或以某种方式启动函数"generateProblems",最好使用参数"id" 这是我的部分索引.html: 这是我的PHP/Javascript: 我做错了什么?在我将其拆分之前,代码运行得很好,但现在单击其中一个按钮不会产生任何结果。 <div id="testpile" class="inner cover">
<div id="buttons">
<p><a id="rat" class="btn btn-default" role="button">Rationel</a></p>
<p><a id="emo" class="btn btn-default" role="button">Emotionel</a></p>
<p><a id="per" class="btn btn-default" role="button">Personel</a></p>
</div>
</div>
<div id="testdrop" class="mastfoot">
<p>Drop numbers here</p>
</div>
<script type="text/javascript">
$("#buttons").find(".btn").click(function() {
var id = this.id;
$("#testpile").load("include/responseget.php");
$.post("include/responseget.php", {
choice: "id",
});
});
</script>
<?php include 'login.php';
//Query til at finde information til generation af question
$stmt = $conn->prepare("SELECT DISTINCT ResponseTitle, ResponseText FROM response Limit 8;");
$stmt->execute();
$result = $stmt->get_result();
while($row = $result->fetch_assoc())
{
$rTitle_array[] = $row['ResponseTitle'];
$rText_array[] = $row['ResponseText'];
}
json_encode($rTitle_array);
json_encode($rText_array);
// close connection
mysqli_close($conn);
?>
<script type="text/javascript">
$(function() {
var phase = 0;
var rTitle = <?php echo json_encode($rTitle_array); ?>;
var rText = <?php echo json_encode($rText_array); ?>;
function generateProblems(param) {
var problemDef = param;
$("#buttons").hide();
var numbers = [1, 2, 3, 4, 5, 6, 7, 8];
for (var i = 0; i < 8; i++) {
$('<div>' + rTitle[i] + '</div>').data('number', rTitle[i]).attr('id', 'problem' + rTitle[i]).appendTo('#testpile').draggable({
containment: '.site-wrapper',
stack: '#testpile div',
cursor: 'move',
revert: true
});
$('<div>' + rText[i] + '</div>').data('number', rText[i]).attr('id', 'problem' + rText[i]).appendTo('#testpile');
}
$('#testdrop').droppable({
drop: handleDropEvent,
accept: '#testpile div'
});
function handleDropEvent(event, ui) {
var problemNumber = ui.draggable.data('number');
var problemCombination = problemDef + problemNumber;
ui.draggable.draggable('disable');
ui.draggable.draggable('option', 'revert', false);
phase++;
alert('ProblemCombination is "' + problemCombination + '", phase is "' + phase + '" ');
$("#testpile").children().hide();
generateProblems(problemCombination);
}
}
});
</script>
这不是正确的做法。让php远离html/js。你不能从另一个没有直接包含在其中的脚本访问你的html。
- 将您的javascript部分重新添加到index.html
- 在php脚本返回中像
return json_encode($rTitle_array);
这样的结尾 - 在您的jquery/ajaxpost,获取返回值并使用它
jquery文档中的示例:
var posting = $.post( url, { s: term } );
// Put the results in a div
posting.done(function( data ) {
var content = $( data ).find( "#content" );
$( "#result" ).empty().append( content );
});