我不知道如何搜索从jQTouch应用程序的XML获取数据的实际问题,所以我希望你能帮助我。
以下是正常工作的代码部分 - 找到标题中带有关键字的正确条目总和。
但是,没有显示变量。 那么如何将其他搜索查询字段添加到游戏中呢?
我的XML基础
<?xml version="1.0" encoding="UTF-8"?>
<programm>
<kurs nr="11165010">
<nr>11165010</nr>
<bereich>Bereich 1</bereich>
<titel>abc</titel>
<text>Text 1</text>
<bezirk>Bezirk 1</bezirk>
</kurs>
<kurs nr="11201061">
<nr>11201061</nr>
<bereich>Bereich 2</bereich>
<titel>Xyz</titel>
<text>Text 2</text>
<bezirk>Bezirk 2</bezirk>
</kurs>
...
</programm>
我的HTML
<div id="kurs_suche">
<div class="toolbar">
<h1>Kursprogramm</h1>
<a href="#home" class="button back"><img alt="home" src="thumbs/home.png" align="absmiddle"/></a>
</div>
<form id="search">
<ul class="rounded">
<li id="notice">Detail-Kurssuche:</li>
<li><input name="suche_text" type="text" id="suche_text" placeholder="Suchwort(e)" autofocus/></li>
<li>
<select name="suche_bereich" id="suche_bereich">
<option value="0" selected='selected'>Bereich (optional)</option>
<option value='Bereich 1'>Bereich 1</option>
<option value='Bereich 2'>Bereich 2</option>
</select>
</li>
<li>
<select name="suche_bezirk" id="suche_bezirk">
<option value="0" selected='selected'>Bezirk (optional)</option>
<option value='Bezirk 1'>Bezirk 1</option>
<option value='Bezirk 2'>Bezirk 2</option>
</select>
</li>
</ul>
<a href="#" class="whiteButton submit">Kurs(e) finden</a>
</form>
</div>
<!-- KURSE SUCHERGEBNIS -->
<div id="kurs_liste">
<div class="toolbar">
<h1>Suchergebnis</h1>
<a href="#home" class="button back">zurück</a>
</div>
<div id="kurs_liste_ausgabe">
<ul class="rounded" id="kurse">
<li>Kurse werden geladen ...</li>
</ul>
</div>
</div>
<!-- KURS ANSICHT -->
<div id="kurs_detail">
<div class="toolbar">
<h1>Kurs Details</h1>
<a href="#home" class="button back">zurück</a>
</div>
<div id="kurs_details">
<p>
Kurs wird geladen ...
</p>
</div>
</div>
我的jQuery:
$(document).ready(function () {
$('#search').submit(function () {
//grab the notice div so we can manipulate it
var notice = $('#notice');
//grab the notice instructions so we can reset
var noticetxt = notice.html();
//set notice to searching...
notice.empty().append('Kurse werden gesucht, bitte warten ...');
//get the keywords
var stext = $('#suche_text').val();
var sbereich = $('#suche_bereich option:selected').val();
var sbezirk = $('#suche_bezirk option:selected').val();
$.ajax({
type: "GET",
url: "kursprogramm.xml",
dataType: "xml",
success: function (data) {
parseXML(data);
jQT.goTo('#kurs_liste', 'slideleft');
}
});
function parseXML(data) {
var pub = "";
$(data).find('kurs').find("titel:contains('" + stext + "')").each(function () {
var knr = $(this).find('nr').text();
var ktitel = $(this).find('titel').text();
var kbereich = $(this).find('bereich').text();
var kbezirk = $(this).find('bezirk').text();
var kvdat = $(this).find('vondatum').text();
pub += '<li class=\"arrow\"><a href=\"#kurs_detail\" class=\"KursLink slideleft\" id=\"' + knr + '\">' + ktitel + '<br />' + kbezirk + ', ' + kvdat + '</a></li>' + '\n';
});
$('#kurse').html(pub);
}
});
});
答案 0 :(得分:0)
澄清要求:
以下代码更新为不需要搜索字符串。
~~~
首先,请注意contains()
区分大小写!您的用户可能不会那么欣赏。 ;)
考虑像这样扩展jQuery:
//--- Extend jQuery with a case-insensitive version of contains().
jQuery.extend (
jQuery.expr[':'].containsCI = function (a, i, m) {
var sText = (a.textContent || a.innerText || "");//-- faster than jQuery(a).text()
var zRegExp = new RegExp (m[3], 'i');
//Pro tip. This allows search on regular expressions, too!
return zRegExp.test (sText);
}
);
然后像这样的代码应该工作:
See it in action at jsFiddle.
var srchResults;
//--- Are we searching for text?
if (stext == 0 || /^\s*$/.test (stext) ) {
//--- No text search was given. Case-sensitive is fine, here.
srchResults = $("kurs", data).find ("bereich:contains('" + sbereich + "'), bezirk:contains('" + sbezirk + "')")
} else {
//--- text search. The select boxes will also be filtered, below.
srchResults = $("kurs", data).find ("titel:containsCI('" + stext + "')")
}
var pub = "";
srchResults.parent ().each (function () {
//--- "this" is one of the <kurs> nodes that matches the search string.
var childVals = {};
//--- Capture the value of each child node. Note that structure is single-depth.
$(this).children ().each ( function () {
//-- Note that nodeName is always returned in all uppercase.
childVals [this.nodeName] = $(this).text ();
} );
//--- Are we filtering on selectors?
if (sbezirk != 0 && sbezirk != childVals.BEZIRK) return;
if (sbereich != 0 && sbereich != childVals.BEREICH) return;
//--- Build the HTML nodes.
//Note that vondatum is not in the data!
pub += '<li class="arrow">'
+ '<a href="#kurs_detail" class="KursLink slideleft" id="' + childVals.NR + '">'
+ childVals.TITEL + '<br />' + childVals.BEZIRK + ', ' + childVals.BEREICH
+ '</a>'
+ '</li>\n';
} );
$('#kurse').html (pub);