$('#textboxId'）.val(） 返回旧值(浏览器缓存问题）

$('#textboxId').val() returning old value (browser cache issue)

本文关键字：浏览器 问题 缓存 val #textboxId 返回      更新时间：2023-09-26

尽管花了几个小时，我还是想不通。我有一个简单的动态创建的页面（使用控制器加载的 vbhtml），其中包含两个文本框。

页面上有一个保存按钮。此按钮调用页面内的 Javascript 函数。在函数中，我有这些行：

function saveData()
{
var lDescr = $('#FundNote').val();  // FundNote is the id of a textbox
var DocUrl = $('#DocUrl').val();  // DocUrl is the id of another textbox
alert(lDescr);
alert(DocUrl);
  //ajax call to a controller
}

问题是，每次显示此页面时，这些变量都会继续返回与第一次输入的值相同的值。如果我清理浏览器缓存，则会返回新输入的值，但会一直返回相同的值，直到再次清理浏览器缓存。 每次显示此页面时，文本框都是空的，用户输入值，因此页面本身不会保留值。

有什么指示吗？

更新

花了几天时间后，这就是我（暂时）修复它的方式。

看起来，即使控制器正在发送更新的 html 并且在浏览器上显示正常（html 包含一个下拉框，该下拉框动态填充不同的值。 每次值不同时，但在javascript中，都会返回旧值（例如，选择选项的旧值，该值甚至不包含在html的当前呈现中）。仍然不知道为什么会发生这种情况。 解决方案中还有其他类似的页面，它们工作正常。

无论如何，我所做的（现在让它工作），我在类中添加了一个 RandonNo（） 属性，该属性动态创建此 html（通过控制器和 vbhtml 文件）。然后在 vbhtml 中，我将这个 randon 编号附加到所有 html 组件 ID 中。 我也像这样OnClick="Save('@Model.RandonNo')将相同的数字传递给 javascript "Save()"函数。 在保存方法中，我更改了$('#idOption') to $('#idOption-'+ randomno). 它似乎正在工作，因为每次 id 都不同。

我知道这是一个古老的问题，但我觉得它需要一个解决方案，因为jQuery仍在这样做。 我一直遇到非常相似的问题，但最终能够找到解决方法。 问题似乎出在 .val（ ） 中。 出于某种原因，jQuery希望在用于获取/设置输入时自动填充缓存中的输入。 在我的情况下，我正在做这样的事情：

文件：

<form ...>
    <input type="hidden" name="my_value" value="X" />
</form>

JS文件：

$( document ).ajaxSuccess( function ( event, jqxhr, settings, data ) {
    if ( settings.dataType == 'json' && data && data.my_value ) {
        $( 'input[name="my_value"]' ).val( data.my_value );
    }
} );

如果我在不清除缓存的情况下刷新页面，则输入将自动被初始页面请求中 AJAX 请求中的缓存值覆盖，即使它们已经填充了服务器响应中的值。 为了解决这个问题，我将 .val（ ... ） 更改为 .attr（ 'value'， ...），因此：

$( 'input[name="my_value"]' ).val( data.my_value );

成为

$( 'input[name="my_value"]' ).attr( 'value', data.my_value );

所以我认为你需要在这里做的是解决你的问题，只需改变：

var lDescr = $('#FundNote').val();  // FundNote is the id of a textbox
var DocUrl = $('#DocUrl').val();  // DocUrl is the id of another textbox

自

var lDescr = $('#FundNote').attr( 'value' );  // FundNote is the id of a textbox
var DocUrl = $('#DocUrl').attr( 'value' );  // DocUrl is the id of another textbox

我不确定这是jQuery本身还是导致此问题的插件，但这真的很奇怪。 似乎如果您在任何时候使用 .val（ ） 从/到输入获取/设置值，如果您稍后刷新或再次访问该页面，则会导致输入的值被缓存值损坏。 这种损坏似乎不会在调用 .val（ ） 时发生，而是在加载文档时发生。

总而言之，对输入的 get/set 的 .val（ ） 调用会导致在初始页面请求期间缓存返回/设置的值。 将来的请求将在文档加载后使用初始请求期间返回/设置的值损坏输入的值，直到您清除浏览器缓存。

有时浏览器会缓存表单输入值，因此如果您返回页面，则无需重新键入内容。 要禁用它，请设置 <form ... autocomplete="off"> 。 这将阻止表单重新加载用户上次在页面加载时键入的内容。

听起来这不是您关心

的问题，而是您关心的是输入中的文本不是从.val()返回的文本。 如果是这种情况，请显示一些代码，让我们深入研究。

不要缓存值 （.val（）），缓存 jQuery 对象： 

function saveData() {
var lDescr = $('#FundNote');  // FundNote is the id of a textbox
var DocUrl = $('#DocUrl');  // DocUrl is the id of another textbox
    alert( lDescr.val() );
    alert( DocUrl.val() );
  //ajax call to a controller
}

我遇到了同样的问题，经过一些尝试，我发现了一种适合我的替代方案......

$("#id").valueOf().valueOf().valueOf().val();

可能看起来有些"奇怪"的解决方案，但它有效！

我遇到了同样的问题，我用attr("value")切换了val()来修复它。

相关文章：