タップ イベント コードをステップ実行すると、ddlValues を適切に選択されたオプションに設定すると、予想どおりの正確な動作が表示されますが、コードの後にイベント バブリング コードが実行されると、選択されたオプションが毎回最初のオプションに戻されます。イベントが発生したため、他のコードが実行されていないことを確認したため、関連性のみを示すページ内のすべてのコードを次に示します。
この選択コントロールは、2 ページの jquery モバイル スタイルの page2 にあります。タップ イベント、最後のイベントで、changepage メソッドに注意してください。その後、オーバーライドされる設定を開始します。
グローバル hdn コントロールに設定したい値があるため、値をリセットするのに十分遅く実行されるイベントが見つかりません。
<script>
$(document).ready(function () {
function GetPricing(cardid) {
var prices = $('#ddlValues');
var cardp = {};
cardp.cardid = cardid;
var datax = JSON.stringify(cardp);
$.ajax({
type: "POST",
url: "cardedit.aspx/GetPricing",
data: datax,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
prices.empty();
$.each(response.d, function (index, item) {
prices.append(new Option(item.Name, item.ID));
});
prices.selectmenu("refresh");
},
error: function () {
alert("Failed to load data");
}
});
}
function GetDetail(id) {
var cardd = {};
cardd.id = id;
var datax = JSON.stringify(cardd);
$.ajax({
type: "POST",
url: "cardedit.aspx/GetDetail",
data: datax,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var vals = response.d;
$('#txtNumber').val(vals[0]);
$('#txtPrice').val(vals[1]);
$('#txtTrade').val(vals[2]);
$('#txtSell').val(vals[3]);
$('#txtWholesale').val(vals[4]);
},
error: function () {
alert("Failed to load data");
}
});
}
function GetDetailx(id) {
var cardd = {};
cardd.id = id;
var datax = JSON.stringify(cardd);
$.ajax({
type: "POST",
url: "cardedit.aspx/GetDetailx",
data: datax,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var vals = response.d;
$('#txtPrice').val(vals[0]);
$('#txtTrade').val(vals[1]);
$('#txtSell').val(vals[2]);
$('#txtWholesale').val(vals[3]);
},
error: function () {
alert("Failed to load data");
}
});
}
$('#ddlCards').change(function () {
var cardid = $(this).attr('value');
GetPricing(cardid);
});
$('#ddlValues').change(function () {
var priceid = $(this).attr('value');
$('#hdnPriceid').val(priceid)
GetDetailx(priceid);
});
$('.cardxx').on('tap', function () {
var x = $(this);
var id = x.data("id");
$('#hdnCardid').val(id);
var cardid = x.data("cardid");
var priceid = x.data("priceid");
$('#hdnPriceid').val(priceid);
var pagex = $('#page2');
$.mobile.changePage(pagex);
var cards = $('#ddlCards');
cards.val(cardid);
cards.selectmenu("refresh");
GetPricing(cardid);
GetDetail(id);
var pricexs = $('#ddlValues');
pricexs.val(priceid);
pricexs.selectmenu("refresh", true);
event.stopPropagation();
});
});
</script>
私のコードが実行された後、jquery と jquerymobile のコードが実行されているのがわかりますが、なぜ ddlValues を最初のオプションに戻すのかを理解するには十分ではありません。
set select オプションを 4 分の 1 秒遅らせれば問題は解決しますが、それは粗雑すぎるようです。