我想使用 jquery 和 html 在我的应用程序中创建一个搜索页面。我的数据库在 chrome web 数据库中。现在它只有一个接口框架。我看过一些教程，但没有一个提到菜单或滑块。我不知道如何从他们那里获得价值。而且我确实尝试使用 获取depMenu值var depMenu = $("#depMenu option:selected").val();，但似乎只是获取第一个值，所以我认为它可能首先需要刷新。但这两个//depMenu[0].selectedIndex = 0;
//depMenu.selectmenu("refresh");根本行不通。
我非常着急解决它，任何帮助提前谢谢！
这是html：
<div data-role="page" id="ASearch" data-add-back-btn="true" data-back-btn-text="Back">
<div data-theme="a" data-role="header">
<h3>
Search
</h3>
</div>
<div data-role="content">
<div data-role="fieldcontain" id="search">
<fieldset data-role="controlgroup">
<input name="" id="TextSearch" placeholder="enter your search term here" value="" type="search" />
</fieldset>
</div>
<div data-role="fieldcontain">
<label for="depMenu">
Department:
</label>
<select id="depMenu" name="" data-theme="b">
<option value="View all">
All department
</option>
<option value="value">
Ladies
</option>
<option value="value">
Men
</option>
<option value="value">
Kids
</option>
</select>
</div>
<div data-role="fieldcontain" id="actMenu">
<label for="actMenu">
Activities:
</label>
<select id="actMenu" name="" data-theme="b">
<option value="option1">
All activites
</option>
<option value="value">
Camping
</option>
<option value="value">
Walking
</option>
<option value="value">
Skiing
</option>
<option value="value">
Climbing
</option>
<option value="value">
Travel
</option>
<option value="value">
Cycling
</option>
<option value="value">
Fishing
</option>
</select>
</div>
<div data-role="fieldcontain" id="slider">
<fieldset data-role="controlgroup">
<label for="slider">
Price
</label>
<input id="slider" type="range" name="slider" value="50" min="0" max="100" data-highlight="true" data-theme="b" data-track-theme="d" />
</fieldset>
</div>
<input id="ClearButton" type="submit" data-theme="c" data-icon="delete" data-iconpos="right" value="Clear" />
<input id="SubButton" type="submit" data-theme="b" data-icon="check" data-iconpos="right" value="Submit" />
</div>
</div><!--/page-->
这是数据库：
function createDatabaseAndPopulateRecords() {
//set-up datavase name , version, displayname,max size
db = openDatabase('outdoorsshop', '1.0', 'beactiveshop', 2 * 1024 * 1024);
db.transaction(function (txs) {
txs.executeSql('CREATE TABLE IF NOT EXISTS shops (id unique, name TEXT, price TEXT, department INTEGER, activities INTEGER,\
large INTEGER, descr TEXT, img TEXT)');
txs.executeSql('DELETE FROM shops');
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['1', 'Mens Workout clothes ', '£38', '2', '0', 'brand: Lefan / Lu Iraq Sanskrit color-coded: black Item: 21 817 sportswear size (non-mandatory): M L XL', 'image/cmen2.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['2', 'Road Iraqi Sanskrit ', '£64', '2', '0', 'Fitness apparel leader brand Aerobics clothing, mens movement suite', 'image/cmen1.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['3', 'Autumn ladies lipstick', '£95', '1', '0', 'the same paragraph of shinee key fx Amber Autumn ladies lipstick baseball uniform sweater coat couple shirt', 'image/cladies1.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['4', 'Female genuine badminton clothing ', '£125', '1', '0', 'Mr Adams parked the spring new female genuine badminton clothing fitness sportswear ', 'image/cladies2.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['5', 'Bodysuit', '£87', '3', '0', 'Short-sleeved bodysuit in soft jersey with a print on the front and press-studs on one shoulder and at the crotch. 95% cotton, 5% ', 'image/ckids1.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['6', 'Leisure hammock ', '£121', '0', '1', 'Tmall season only swim the authentic outdoor and indoor leisure hammock widening canvas thick double hammock', 'image/camp1.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['7', 'Single hammock ', '£88', '0', '1', ' Really useful funky looking small daypack. Its very light weight and snug comfy fit round the body makes it one of our most popular packs for everyday use.', 'image/camp2.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['8', 'CNHIMALAYA', '£199', '0', '2', 'Luxury Design Three Room Leisure 5-6 Person Family Camping Tent', 'image/tent1.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['9', 'Large Camping Tents For Sale ', '£18.5', '0', '2', 'Product Name: Antelope Super Large Rain-Proof Camping Tent Brand: Antelope SKU: cp0076 Weight: 9kg', 'image/tent2.jpg']);
txs.executeSql('INSERT INTO shops (id, name, price, department, activities, descr, img) VALUES (?,?,?,?,?,?,?)', ['10', 'Fiberglass transparent fishing rod ', '£18.5', '0', '2', 'Fishing rod pole in hand, sea fishing rod, hand sea dual-purpose rod three. Sea fishing rod length is about 1.6 meters - 2.4 meters, have longer.', 'image/fishing1.jpg']);
});
}
这是jQuery：
$(document).ready(function () {
// getting the value that user typed
var searchString = $("#TextSearch").val();
// forming the queryString
var data = 'search=' + searchString;
var depMenu = $("#depMenu option:selected").val();
//depMenu[0].selectedIndex = 0;
//depMenu.selectmenu("refresh");
$("#SubButton").on("click", function (e) {
var asearchString = $(this).val();
alert($("#TextSearch").data());
alert(depMenu);
//var v = search.val().toLowerCase();
if (depMenu == "view all") {
db.transaction(function (txsLadies) {
txsLadies.executeSql('SELECT * FROM shops WHERE shops.department=1', [], function (txs, ladies_results) {
var len1 = ladies_results.rows.length, i;
$("#SearchResultList").empty();
alert('Failed because');
for (i = 0; i < len1; i++) { //for each record in the resultse
var LadiesRecord = ladies_results.rows.item(i); //get the current record from the database recordse
//.append funciton to add records
$('#SearchResultList').append("<div style=\"border-bottom:1px solid black;padding:10px;margin:10px;\">" +
LadiesRecord.name + "(" + LadiesRecord.price + ") Rating: " + LadiesRecord.img + "</div>");
}
$("#SearchResultList").hide();
});
});
} else {
return false;
alert('Failed because');
}
});
});
$('#ClearButton').live('click', function () {
var myselect = $("#depMenu");
myselect[0].selectedIndex = 0;
myselect.selectmenu("refresh");
});
});