首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >当使用表排序表中的输入元素时,如何使用input掩码获得输入元素以避免还原对前一个值的更改?

当使用表排序表中的输入元素时,如何使用input掩码获得输入元素以避免还原对前一个值的更改?
EN

Stack Overflow用户
提问于 2021-06-23 03:16:29
回答 1查看 43关注 0票数 2

我花了相当多的时间在使用输入掩码的输入元素的问题上,在使用tablesorter排序的表中。

当用户在触发updateRows事件后,在掩码字段中输入一个输入,然后更改焦点,该屏蔽字段将将内容还原为先前输入的值。

我已经倾注了两个插件的文档来解决问题,但我没有找到合适的解决方案。我意识到还有其他解决这个问题的方法,但是我有ajax代码(用于自动分别保存每一行),这需要重写,如果可以避免的话,我不希望这样做。

任何帮助都将不胜感激。

示例:https://jsfiddle.net/5bqyod6j/1/

代码:

代码语言:javascript
运行
复制
<table id='table'>
  <thead>
    <tr>
      <th class='sorter-inputs'>Col 1</th>
      <th class='sorter-inputs'>Col 2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <div class="control"><input type="text" class='money' value='25' form='f-1'></div>
      </td>
      <td>
        <div class="control"><input type="text" value='test2' form='f-1'></div>
      </td>
    </tr>
    <tr>
      <td>
        <div class="control"><input type="text" class='money' value='12' form='f-2'></div>
      </td>
      <td>
        <div class="control"><input type="text" value='another 2' form='f-2'></div>
      </td>
    </tr>
    <tr>
      <td>
        <div class="control"><input type="text" class='money' value='89' form='f-3'></div>
      </td>
      <td>
        <div class="control"><input type="text" value='val-2' form='f-3'></div>
      </td>
    </tr>
  </tbody>
  <!-- These are part of the ajax functionality -->
  <form action="" id="f-1"></form>
  <form action="" id="f-2"></form>
  <form action="" id="f-3"></form>
</table>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/tablesorter@2.31.3/dist/js/jquery.tablesorter.min.js" integrity="sha256-dtGH1XcAyKopMui5x20KnPxuGuSx9Rs6piJB/4Oqu6I=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/tablesorter@2.31.3/dist/js/parsers/parser-input-select.min.js" integrity="sha256-ugEATjydQqCNpuca1CGyiLVdN9N6uuouP2CkIL7Dr1k=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/gh/RobinHerbots/jquery.inputmask@5.0.6/dist/jquery.inputmask.js" integrity="sha256-E9pFDiHlfB3afd46AyTqvmjcSv7VREgs5Y5e8TBECU0=" crossorigin="anonymous"></script>
<script>
  $('#table').tablesorter()
  $('.money').inputmask('currency', {
    autoUnmask: true,
    groupSeparator: ',',
    allowMinus: true,
    digits: 2,
    placeholder: '_',
    inputMode: 'decimal'
  })
  $('input[type=text]').on('change', function() {
    $('#table').trigger('updateRows')
  })
</script>
EN

回答 1

Stack Overflow用户

发布于 2021-06-23 04:41:43

发现了问题。它位于js/解析器/解析器-输入-select.js中。它似乎在不合时宜的时候附加了一些处理程序,以便很好地处理输入掩码。编写自定义解析器或文本提取器,并在更好的时间更新表,似乎工作得很好。

我还发现,即使加载上述文件,甚至根本不使用解析器,也会触发错误。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/68093108

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档