在选择 onchange 时更改样式并停止返回原始样式答案

【问题标题】：change style on select onchange and stop returning to original style在选择 onchange 时更改样式并停止返回原始样式
【发布时间】：2018-04-12 14:05:13
【问题描述】：

我正在尝试使用 javascript 或 jQuery 添加类或将 css 更改为 select 中 onchange="javascript:setTimeout 之后的跨度。我遇到的问题是，在用户更改表单后，它会更改 css 一秒钟然后消失。我怎样才能让css保持在原地？它似乎会自动刷新并返回原始样式。

js:

$("select").change(function() {
  $(this).closest('div').find('span').css("background-color", "yellow");
});

html:

<div id="ctl00_MainContent_ipcResMakePax_ipcPaxBox_rptTravellers_ctl01_pnlDateOfBirth" class="formlistitem">
  <span id="ctl00_MainContent_ipcResMakePax_ipcPaxBox_rptTravellers_ctl01_lblDateOfBirth" class="formlabel">Date of birth</span>
  <br>
  <select name="ctl00$MainContent$ipcResMakePax$ipcPaxBox$rptTravellers$ctl01$ddlDateOfBirthDay" onchange="javascript:setTimeout('__doPostBack(\'ctl00$MainContent$ipcResMakePax$ipcPaxBox$rptTravellers$ctl01$ddlDateOfBirthDay\',\'\')', 0)" id="ctl00_MainContent_ipcResMakePax_ipcPaxBox_rptTravellers_ctl01_ddlDateOfBirthDay"
    class="selectday">
  </select>
</div>

【问题讨论】：

__doPostBack() 在做什么？它不会重新加载页面吗？
可能，但我不知道如何找到
__doPostBack 导致页面刷新，为什么样式的变化消失了。尝试使用 ajax 而不是完全回发。如果您不需要回发，请将其删除，样式将保留。
我不能修改原始的html，我只能在上面添加代码。该网站受框架保护，我正在使用可视化网络优化器。无论如何要保留回调，然后在刷新页面后添加样式？

标签： javascript jquery css asp.net dopostback

【解决方案1】：

css更新信息（下拉选择更改后）必须存储在数据库中，后端人员应更改span的类（或使用.net等服务器端技术为span适当添加样式）是你正在使用）取决于数据库中存储的信息

【讨论】：

我认为 doPostBack 函数正在向服务器发送有关选择框状态的信息，因此必须将背景颜色信息与它一起发送到服务器，或者可能它正在做同样的事情。所以

【解决方案2】：

所以请咨询后端人员来处理背景颜色的变化，比如向 span 元素添加一个类，我们可以在其中使背景颜色信息 !important 使其优先。因此，您需要在使用的 css 文件中创建这样一个类，并将类的名称添加到 span 元素中，以便后续页面加载到处理 .net 或服务器端的后端人员

因此，以这种方式跨度将有 2 个类 class="formlabel your_class'

【讨论】：

【解决方案3】：

根据您的限制，您可以通过网络存储 API 使用 sessionStorage 对象来保存跨页面发布/重新加载的当前颜色值：

https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

需要注意的是，如果表单被第二次使用并且需要“新鲜”状态，您需要手动清除它。

【讨论】：