그래서 사용자가 이벤트 이름과 친구의 이름을 입력 할 수있는 검색 기능이있는 웹 페이지에서 작업 중이며 페이지에 이러한 입력을 기반으로 검색 결과가 표시됩니다.여러 검색 결과 인쇄
사전에 사과드립니다. 내 코드는 절대적으로 엉망입니다 (하지만 지금 당장은 신경 써야합니다). 그러나 제 문제는 모든 검색 결과를 인쇄하는 좋은 방법을 모르겠다는 것입니다. 나는 인터넷에 보니 내가이 지금에있는 것은 다음과 같다 :
$('#searchFeedback').empty();
$.each(data.events[i], function (index, value) {
$('#searchFeedback').append(output);
})
이 내가 JQuery와 믹스했다하더라도, 내가 찾은 최고의 옵션 (어떤 방법으로 일을하는 유일한 하나입니다) 그러나 문제는 각 검색 결과를 인쇄하는 대신 올바른 검색 결과를 반복하여 인쇄하는 것입니다. 나는 JQuery에 대해 완전히 단서가 없다.
<script>
function eventSearch() {
var eName = document.getElementById("ename").value;
var fName = document.getElementById("fname").value;
var searchResults = "";
var friendResults = "";
var attendeeText = "";
if (eName === "" && fName === "") {
document.getElementById("searchFeedback").innerHTML = "<h4 class='eName'>Fields cannot be empty!</h4>";
} else {
for (var i = 0; i < data.events.length; i++) {
searchResults = data.events[i].eName.toUpperCase();
var output = "<h4 class='eName'>" + data.events[i].eName + " • " + data.events[i].date + "</h4> <p class='eDesc'>" + data.events[i].description + "<br><sub>" + attendeeText + "<a class='event' onclick='openEventLink(" + i + ");' href=''><b> Check it out here.</b> </a></sub></p><br>";
if (eName != "" && searchResults.includes(eName.toUpperCase())) {
if (data.events[i].attendees.length != 1) {
for (var a = 0; a < data.events[i].attendees.length; a++) {
attendeeText = data.events[i].attendees.join(", ");
}
} else {
attendeeText = data.events[i].attendees;
}
if (data.events[i].attendees.length > 1) {
attendeeText = attendeeText + " are going.";
} else if (data.events[i].attendees.length == 1) {
attendeeText = attendeeText + " is going.";
} else {
attendeeText = "";
}
if (fName != "") {
for (var a = 0; a < data.events[i].attendees.length; a++) {
friendResults = data.events[i].attendees[a].toUpperCase();
if (friendResults.includes(fName.toUpperCase())) {
console.log(searchResults);
console.log(friendResults);
$('#searchFeedback').empty();
$.each(data.events[i], function (index, value) {
$('#searchFeedback').append(output);
})
}
}
} else {
// Print results
}
} else if (eName == "" && fName != "") {
for (var a = 0; a < data.events[i].attendees.length; a++) {
if (friendResults.includes(fName.toUpperCase())) {
console.log(friendResults);
console.log(data.events[i].eName);
if (data.events[i].attendees.length != 1) {
for (var a = 0; a < data.events[i].attendees.length; a++) {
attendeeText = data.events[i].attendees.join(", ");
}
} else {
attendeeText = data.events[i].attendees;
}
if (data.events[i].attendees.length > 1) {
attendeeText = attendeeText + " are going.";
} else if (data.events[i].attendees.length == 1) {
attendeeText = attendeeText + " is going.";
} else {
attendeeText = "";
}
// Print results
}
}
}
}
}
}
/* document.getElementById("searchFeedback").innerHTML =
"<h4 class='eName'>" + data.events[i].eName + " • " + data.events[i].date + "</h4> <p class='eDesc'>" + data.events[i].description + "<br><sub>" + attendeeText + "<a class='event' onclick='openEventLink(" + i + ");' href=''><b> Check it out here.</b> </a></sub></p><br>"; */
</script>
그렇게 대단히 감사합니다 :
은 여기 내 전체 JS 코드입니다!
편집 : 여기 내 데이터베이스의 구조가 있습니다. 거기에 더 많은 것들이로드되어 있지만 여기에 관련 비트가 있습니다.
var data = {
"events": [
{
"eName": "The Dalek Invasion of Earth",
"date": "6.5.2017",
"time": "10-15",
"description": "People assume that time is a strict progression of cause-and-effect... but actually, from a non-linear, non-subjective viewpoint, it's more like a big ball of wibbly-wobbly... timey-wimey... stuff. It is! It's the city of New New York! Strictly speaking, it's the fifteenth New York since the original, so that makes it New-New-New-New-New-New-New-New-New-New-New-New-New-New-New New York. Goodbye...my Sarah Jane! Yeah? Well I'm the Lord of Time. Black tie...Whenever I wear this, something bad always happens.",
"attendees": ["Jack Harkness", "Rose Tyler"],
"eLink": "http://tardis.wikia.com/wiki/The_Dalek_Invasion_of_Earth_(TV_story)"
},
{
"eName": "The Day of the Doctor",
"date": "7.5.2017",
"time": "15-18",
"description": "I'm sorry. I'm so sorry. There's something else I've always wanted to say: Allons-y, Alonso! I don't want to go. Allons-y! What? What?! WHAT?! It is! It's the city of New New York! Strictly speaking, it's the fifteenth New York since the original, so that makes it New-New-New-New-New-New-New-New-New-New-New-New-New-New-New New York. Oh, yes. Harmless is just the word: that's why I like it! Doesn't kill, doesn't wound, doesn't maim. But I'll tell you what it does do: it is very good at opening doors!",
"attendees": ["Amelia Pond", "Donna Noble"],
"eLink": "http://tardis.wikia.com/wiki/The_Day_of_the_Doctor_(TV_story)"
}
]
};
편집 2 : 도움이 될 경우를 대비하여 양식의 HTML도 추가하겠습니다.
<div class="eventSearch">
<h2>Search for events</h2>
<form id="login" onsubmit="return eventSearch()">
<b>By event name:</b> <input type="text" name="ename" id="ename" size="56" placeholder="i.e. The Time War"><br>
<b>By a friend's name:</b> <input type="text" name="fname" id="fname" size="50" placeholder="i.e. Rose Tyler"><br><br>
<input type="radio" name="dates" value="allDates" checked> All events<br>
<input type="radio" name="dates" value="pastDates"> Past events<br>
<input type="radio" name="dates" value="futureDates"> Future events<br><br>
<button type="submit" id="confSearch" name="confSearch" onclick="event.preventDefault(); eventSearch();"><b>Search</b></button><br><br>
</form>
<div id="searchFeedback"></div>
에도 또 다른 편집 : 자세한 설명을 보려면 여기를 라이브 내 웹 페이지의 버전이다 : 나는 확실하지 않다 http://users.metropolia.fi/~natalisu/Event%20calendar/main.html
'$ ('# searchFeedback') 때문에 인쇄가 끝난 것일 수도 있습니다. empty();'? – Leguest
해당 줄을 삭제해도 아무런 차이가 없으므로 그럴 수 없습니다. – Koenshi
좋아, 그럼'data.events [i]'란 무엇입니까? 여기에 보여줄 수 있습니까? – Leguest