jQuery的.data() getter只获取最初用值设置的元素

Question

。。。但是，如果值最初像"一样为空，则不能使用相同的键更改值！

function loadDialog(link, e, ajaxRequest) {
e.preventDefault();
var $title = link.innerHTML;
var $contenturl = $(link).attr('href');
var $dialog = $('<div id="MyDialog"></div>');
// Read value from hidden input field
var templateIdValue = $('input[name=TemplateId]').val();     
// Change the value: This will always and only happen the 2nd time I come here,
// the first time the templateIdValue will always be empty
if (templateIdValue != '') {
templateIdValue = 777;
}
$dialog.load($contenturl).data('templateIdKey', templateIdValue).dialog({
title: $title,
autoOpen: true,
modal: true,               
buttons: {
"OK": function () {debugger;
ajaxRequest($(this), $('form', this));
},
"Cancel": function () {
$dialog.dialog("close");
}
}
});
}

第二次将templateIdValue更改为777 时

我来到这个代码：

在这里，我再次检索值，它应该是777。但事实并非如此。它是空的！

@model ITMS.Web.Models.UnitViewModel
@*Remote Validation*@
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
var templateId = $('#MyDialog').data('templateIdKey');
$('input[name=TemplateId]').val(templateId);      
}); 
</script>
@using (Html.BeginForm("Create", "Unit"))
{ 
@Html.ValidationSummary(false)
<p class="editor-label">@Html.LabelFor(model => model.Name)</p>
<p class="editor-field">@Html.EditorFor(model => model.Name)</p>
<p class="editor-field">@Html.ValidationMessageFor(model => model.Name)</p> 
@Html.HiddenFor(x => x.TemplateId)    
}

如何更改第一次使用.data()方法传递的键的值？

更新

// Does not cache the ajax requests to the controller e.g. IE7/8/9 is doing that...
$.ajaxSetup({ cache: false });
$(document).ready(function () {
$('#OpenTemplate').click(function (event) { loadDialog(this, event, openTemplate); });
$('#CreateTemplate').click(function (event) { loadDialog(this, event, createTemplate); });
$('#DeleteTemplate').click(function (event) { loadDialog(this, event, deleteTemplate); });
$('#CreateUnit').click(function (event) { loadDialog(this, event, createUnit); });
$('#DeleteUnit').click(function (event) { deleteUnit(); });
$('#CreateTeststep').click(function (event) { loadDialog(this, event, createTeststep); });
$('#DeleteTeststep').click(function (event) { deleteTeststep(); });
$('#SaveTemplate').click(function (event) { saveTemplate(); });    
});

Answer 1

即使在更新之后，我也发现你的问题相当令人困惑，所以我仍然不太明白你想做什么，但你使用.data()的方式似乎有两个大问题。

第一个问题是在文档就绪处理程序中检索值：

$(document).ready(function () {
var templateId = $('#MyDialog').data('templateIdKey');

但是该值直到响应于点击而调用CCD_ 2函数才被存储，所以自然地。

其次，每次单击几个元素中的任何一个时，都会调用相同的loadDialog()函数，但每次调用loadDialog()时，它都会创建一个新的"MyDialog"div，然后使用.data()将键和值与该新div关联起来：

var $dialog = $('<div id="MyDialog"></div>');
// other code, then
$dialog.load($contenturl).data('templateIdKey', templateIdValue)

同样，您的问题不清楚，但您似乎是在说，您希望这将更新为先前创建的"MyDialog"div存储的值，但.data()将值与单个元素关联。为什么每次都重新创建对话框div？