使用JS / JQuery。
我希望用户执行的操作是单击页面上显示的名称,并复制与用户单击“查找”按钮时发生的操作相同的操作。基本上是将相关结果返回到页面。
示例页面在此处,http://www.kudosoo.com/friendslist.html,例如,用户单击“ dave”,结果与在文本框中输入“ dave”并单击“ find”时的结果相同
当单击<div id="container"></div>
为什么不返回与单击“查找”按钮相同的结果时,它们都使用相同的查询“ friendFeed”
也许这与字符串存储方式有关?
<!doctype html>
<!-- Runs Parse and FB code that uses Facebook authentication to login user to the site and redirects them to the main content area. This page is fired from the Facebook button being clicked on the site landing page-->
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="fresh Gray Bootstrap 3.0 Responsive Theme " />
<meta name="keywords" content="Template, Theme, web, html5, css3, Bootstrap,Bootstrap 3.0 Responsive Login" />
<meta name="author" content="Adsays" />
<title>Parse JavaScript Todo App</title>
<script src="http://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://www.parsecdn.com/js/parse-1.2.17.min.js"></script>
</head>
<body>
<!-- Initialize the Parse object-->
<script type="text/javascript">
Parse.initialize("79tphN5KrDXdjJnAmehgBHgOjgE2dLGTvEPR9pEJ", "9lblofQNZlypAtveU4i4IzEpaOqtBgMcmuU1AE6Y");
// capture name of user thats been clicked
// return their activty feed of badges etc
var currentUser = Parse.User.current();
var FriendRequest = Parse.Object.extend("FriendRequest");
var query = new Parse.Query(FriendRequest);
query.include('toUser');
// query.include('fromUser');
//query.include('pic');
query.equalTo("fromUser", currentUser);
query.equalTo("status", "Request sent");
query.find({
success: function (results) {
// If the query is successful, store each image URL in an array of image URL's
imageURLs = [];
Username = [];
for (var i = 0; i < results.length; i++) {
var object = results[i].get("toUser");
imageURLs.push(object.get("pic"));
Username.push(object.get("username"));
}
// If the imageURLs array has items in it, set the src of an IMG element to the first URL in the array
console.log(imageURLs);
console.log(Username);
for (var j = 0; j < imageURLs.length; j++) {
$('#container').append("<img class='images' src='" + imageURLs[j] + "'/>");
$('#container').append("<div class='username'>'" + Username[j] + "'</div>");
}
},
error: function (error) {
// If the query is unsuccessful, report any errors
alert("Error: " + error.code + " " + error.message);
}
});
var currentUser = Parse.User.current();
var myBadges = Parse.Object.extend("myBadges");
// Captures the input from the user and checks if the name already exists within the Db.
function friendFeed(name) {
var friendName = name || $('#friendsearch').val();
console.log(friendName);
var query = new Parse.Query(myBadges).matchesQuery("uploadedBy", new Parse.Query("_User").equalTo("username", friendName));
query.find({
success: function (rules) {
imageURLs = [];
for (var i = 0; i < rules.length; i++) {
var object = rules[i];
imageURLs.push(object.get("BadgeName"));
Username.push(object.get("uploadedBy"));
}
for (var j = 0; j < imageURLs.length; j++) {
$('#FriendsStuff').append("<img class='images' src='" + imageURLs[j] + "'/>");
$('#FriendsStuffName').append("<div class='username'>'" + Username[j] + "'</div>");
console.log("here");
}
},
error: function (error) {
//If the query is unsuccessful, report any errors
alert("Error: " + error.code + " " + error.message);
}
});
}
$(document).ready(function () {
$(document).on('click', '.username, #find_button', function (event) {
//debugger;
event.preventDefault();
friendName = $(this).is("button") ? null : $(this).text();
friendFeed(friendName);
});
});
</script>
<div class="error" style="display:none"></div>
<input type="text" id="friendsearch" placeholder="Find Friend" class="input-field" />
<button id="find_button" type="button" class="btn btn-login">Find</button>
<div id="container"></div>
<div id="FriendsStuff"></div>
<div id="FriendsStuffName"></div>
</body>
</html>
最佳答案
您需要单击来自类.username的dave时发生的事件
只需添加:
$(document).on('click', '.username', function (event) {
//debugger;
event.preventDefault();
friendName = $(this).innerHTML; // get content of user
friendFeed(friendName);
});
从个性上讲,我更喜欢将变量用于不同的功能,并将其用于定义和检索$(this).attr(“ YOUR_ATTRIBUTE_NAME”)的元素的属性中,而不是获取div的innerHTML
并将您的字符串存储在:
<div class=".username" YOUR_ATTRIBUTE_NAME="Dave">Dave</div>
关于javascript - 为什么使用按钮或Div运行查询会返回不一致的结果?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/24096751/