简体   繁体   English

如何在等待用户输入时暂停jQuery .each()循环?

[英]How can I pause a jQuery .each() loop, while waiting for user input?

I'm having trouble getting a jQuery .each loop to wait for user input, before continuing iterating. 我在继续迭代之前无法获取jQuery .each loop以等待用户输入。 Here is my code (I've commented with what I would like to happen): 这是我的代码(我已经评论了我想发生的事情):

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="common_components.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="slider.css">

<?php
include_once 'common_components.php';
$query = $dbh->query("SELECT movies_dir FROM settings");
$row = $query->fetch(PDO::FETCH_ASSOC);
date_default_timezone_set('UTC');
echo "<title>Movie Scanner</title>";
?>
<script src="jquery.min.js"></script>
<script>
var retval = "not done";
function EnterManually() {
alert("Entering Data Manually"); //data has been entered manually so exit function & move ontop next index in loop in document.ready.
retval = "done";
}

function insertIntoDB(id,path) {
var request = $.ajax({
url: "update_movie.php?id="+id+"&path="+path,
type: "GET",            
dataType: "html"
});
request.done(function(data) {
if (data == 0) {
alert("Movie Succesfully Inserted"); //data has been entered sucessfully (update movie returns 0) so exit this function & search_file function & move ontop next index in loop in document.ready.
retval = "done";
}
else if (data == 1) {
alert("Unable to insert movie!"); //update_movie.php returns an error (returns 1), so exit this function but DON'T exit search_file function - wait for user to click on another set of details.
retval = "not done";
}
});
}
var files = <?php echo json_encode(preg_grep('/^([^.])/',scandir(realpath($row["movies_dir"]))))?>;
function Search_file(path) {
var xmlhttp;
xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","search_file.php?path="+path,false); //load search_file.php with movie
xmlhttp.send(); //send file off
$('#result').empty();   //clear div of content
document.getElementById("result").innerHTML=xmlhttp.responseText; //load output into page
}
</script>
</head>

<body>

<div id="result">
<script>
$(document).ready(function() {
$.each(files, function(key, value) {
Search_file("<?php echo addslashes(realpath($row["movies_dir"]))?>"+"\\"+value); //iterate to next item in array & run search_file function
});
});

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

Essentially, the 'files' variable contains a JSON array of file paths. 本质上,“ files”变量包含文件路径的JSON数组。 for each index in the array, the Search_file function is run on that path, which should display a list of search results for that file - calling & displaying the search_file.php page. 对于数组中的每个索引, Search_file function在该路径上运行,该路径应显示该文件的搜索结果列表-调用并显示search_file.php页面。

When the user clicks on any of those results in the displayed list, it should attempt to insert (via the InsertIntoDB Function, which calls the update_movie.php file) a record into the database. 当用户单击显示的列表中的任何结果时,用户应尝试(通过InsertIntoDB函数,该函数调用update_movie.php文件)将记录插入数据库。

If that insert is successful ( update_movie returns 0) (or the EnterManually function is triggered) then the functions should all exit, and the .each loop should move onto the next iteration, starting the whole process off again. 如果该插入成功( update_movie返回0)(或触发EnterManually函数),则所有函数均应退出,并且.each循环应移至下一个迭代,从而再次开始整个过程​​。

If that insert function is not successful (so update_movie will return 1), then nothing should happen - the .each loop should not increment. 如果该插入函数不成功(因此update_movie将返回1),则不会发生任何事情.each循环不应递增。 Instead, we should wait for the user to click on another result. 相反,我们应该等待用户单击另一个结果。

At the moment, I cannot get the .each loop to wait until the user has clicked on a result, it just keeps incrementing straight until the last item in the loop. 目前,我无法让.each循环等待用户单击结果,它只是一直递增直到循环中的最后一项。

you could just go through the files one at a time. 您一次只能浏览一个文件。

var index = 0;
$("#result").on("click", function(){
    Search_file("<?php echo addslashes(realpath($row["movies_dir"]))?>"+"\\"+files[index]);
    index++;
});

the idea is every time you click result's div it will load the next file. 这个想法是每次您单击结果的div时,它将加载下一个文件。 I didn't include code to check limit, and things like that. 我没有包含检查限制的代码,诸如此类。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM