javascript - html 表单值在移动浏览器上触摸后重置

标签 javascript jquery mobile

我有一个表单,在 document.ready() 之后,我将数据加载到此表单中,但点击屏幕后,表单值(设备名称)在移动浏览器上被清除。

$.ajax({
  type: 'GET',
  url: "api.ashx",
  data: "operation=device.get&deviceid=" + deviceid,
  success: function(response) {
    var apiResponse = jQuery.parseJSON(response);
    if (apiResponse.result == 'true') {
      $("#name").val(apiResponse.name);
      if (apiResponse.online == 'true') {
        $("#status").html('<span class="label label-success">online</span>');
      } else {
        $("#status").html('<span class="label label-red">offline</span> Был в сети: ' + apiResponse.lastvisit);
      }
    }
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<form id="deviceinfoform" action="#" class="form-horizontal">
  <div class="form-body">
    <div class="form-group">
      <label class="col-sm-3 control-label">Device name <span class="require">*</span>
      </label>
      <div class="col-sm-6 controls">
        <input id="name" name="name" required="" type="text" placeholder="Device name" maxlength="100" class="form-control"></input>
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 control-label">Device status</label>
      <div class="col-sm-6 controls">
        <div id="status" class="form-control">
          <span class="label label-success">online</span>
        </div>
      </div>
    </div>
  </div>
</form>

最佳答案

问题已解决。问题出在 bootstrap-responsive-tabs 插件中。

fakewaffle.toggleResponsiveTabContent = function () {

var tabGroups = $('.nav-tabs.responsive');

$.each(tabGroups, function () {
    var tabs = $(this).find('li a');

    $.each(tabs, function () {
        var href         = $(this).attr('href').replace(/#/g, ''),
            tabId        = "#" + href,
            panelId      = "#collapse-" + href,
            tabContent   = $(tabId).html(),
            panelContent = $(panelId + " div:first-child").html();

        //!!!clear all dynamic content
        $(tabId).html(panelContent);
        $(panelId + " div:first-child").html(tabContent); 
    });

});

};

更新到最新版本解决了问题。

关于javascript - html 表单值在移动浏览器上触摸后重置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26315316/

相关文章:

javascript - 拖出链接后 jQuery mouseup 不触发

javascript - 单击 map 外部时传单缩放 map

html - 具有 HTML5 移动兼容性的 .Net OLAP Cube Explorer 控件

javascript - HTML5 Range 功能在移动设备上损坏

mobile - 显示平板电脑的桌面版本

javascript - typescript 类型错误: Cannot read property 'collection' of undefined

javascript - Canvas 绘制的图像大小与返回的数据不同

jquery - 如何仅替换 "stand alone"匹配项?

javascript - 如何使用 Backbone Collection 获取此 JSON 结果?

jquery - 转换矩阵数组