それは私だけでしょうか? jQuery モバイルを使用すると、一歩前進して 2 歩後退するように見えますか?
私がやろうとしているのは、オートコンプリートオプションを機能させることだけです。jQuery Mobile.AutoComplete を使用してみましたが、動作しないため、jQuery ui.autocomplete を使用しようとしています。
Asp.net MVC を使用して、共有ページを作成しました。
私はこれを機能させるために必死です。助けてください（jQueryを使用してモバイルオートコンプリートオプションを機能させるのが最善かどうかは気にしないでください）....
<head>
...
<script src="~/Scripts/JQuery/jquery.1.9.1.min.js"></script>
<script src="~/Scripts/JQuery/UI/jqueryUI-1.10.2.min.js"></script>
<script src="~/Scripts/JQuery/Mobile/jquery.mobile-1.3.0.min.js"></script>
<script src="~/Scripts/DateValidation.js" type="text/javascript"></script>
<script src="~/Scripts/JQuery/UI-TimePicker/jquery.ui.timepicker.js"></script>
<script>
$.ajaxSetup ({
// Disable caching of AJAX responses
cache: false
});
</script>
</head>
次に、メニューがあります（共有）
<div data-theme="b" data-role="header">
<script type="text/javascript">
$(function () {
$("#clientSearch").autocomplete({
source: "@Url.Action("ClientSearch","Schedule")",
minLength: 3,
select: function (event, ui) {
$("#clientSearch").val(ui.item.ClientName);
$("#clientSearchId").val(ui.item.ClientId);
return false;
}
}
).data("uiAutocomplete")
._renderItem = function (ul, client) {
return $("<li></li>")
.data("item.autocomplete", client)
.append("<a>" + client.FullName + "</a>")
.appendTo(ul);
};
});
</script>
<h3>Schedule</h3>
<a href="index.html" data-icon="plus" class="ui-btn-right"data-iconpos="notext">Appointment</a>
<input type="hidden" id="clientSearchId"/>
<input name="clientSearch" id="clientSearch" placeholder="" value="" type="search">
<div data-role="navbar" data-iconpos="top">
<ul>
<li>
<a href="~/Home/Index" data-transition="slide" data-theme="">
Home
</a>
</li>
<li>
<a href="/Schedule/MobileSchedule" data-transition="slide" data-theme="">
Schedule
</a>
</li>
</ul>
</div>
</div>
したがって、ページは次のようになります
@{
ViewBag.Title = "Home";
Layout = "~/Views/Shared/_AppHomeLayout.cshtml";
}
<div data-role="page" id="pageHome">
<style>
.ui-listview-filter-inset {
margin-top: 0;
}
</style>
@RenderPage("~/Views/Shared/_MobileMenu.cshtml")
<div data-role="content">
<div data-role="content"> ... </div>
</div>
</div>
ページの読み込み時に次のエラーが表示されます。
キャッチされていないエラー: NotFoundError: DOM 例外 8 jquery.1.9.1.min.js:11 (匿名関数) jquery.1.9.1.min.js:11 b.fn.extend.domManip jquery.1.9.1.min.js :11 b.fn.extend.replaceWith jquery.1.9.1.min.js:11 (匿名関数) jquery.mobile-1.3.0.min.js:2 b.extend.each jquery.1.9.1.min. js:4 b.fn.b.each jquery.1.9.1.min.js:4 (匿名関数) jquery.mobile-1.3.0.min.js:2 b.event.dispatch jquery.1.9.1.min .js:4 v.handle jquery.1.9.1.min.js:4 b.event.trigger jquery.1.9.1.min.js:4 (匿名関数) jquery.1.9.1.min.js:11 b .extend.each jquery.1.9.1.min.js:4 b.fn.b.each jquery.1.9.1.min.js:4 b.fn.extend.trigger jquery.1.9.1.min.js: 11 a.Widget._trigger jquery.mobile-1.3.0.min.js:2 a.Widget._createWidget jquery.mobile-1.3.0.min.js:2 a.widget._createWidget jquery.mobile-1.3.0. min.js:2 (匿名関数) jquery.mobile-1.3.0.min.js:2 a.(匿名関数).(匿名関数) jquery.mobile-1.3.0.min.js:2 (匿名関数) jquery.mobile-1.3.0.min.js:2 b.extend.各 jquery.1.9.1.min.js:4 b.fn.b.各 jquery.1.9.1.min.js:4 a.fn.(匿名関数) jquery.mobile-1.3.0.min.js: 2 C jquery.mobile-1.3.0.min.js:2 a.mobile.allowCrossDomainPages.h.isSameDomain.a.ajax.success jquery.mobile-1.3.0.min.js:2 c jquery.1.9.1. min.js:4 p.fireWith jquery.1.9.1.min.js:4 k jquery.1.9.1.min.js:19 rjs:2 c jquery.1.9.1.min.js:4 p.fireWith jquery.1.9.1.min.js:4 k jquery.1.9.1.min.js:19 rjs:2 c jquery.1.9.1.min.js:4 p.fireWith jquery.1.9.1.min.js:4 k jquery.1.9.1.min.js:19 r
アイデア？jQuery モバイル オートコンプリートを使用しようとしているようです。修正するソリューション\コード サンプルがあれば、とても助かります。