Question

我正在编写一个小型网络应用程序来记录团队成员的工作时间。这一切都运作良好，除了一件事。当您在字段集上选项卡时，将打开一个新页面，其中包含一个表单以更改该人员的时间。第一次选项卡有效，但是当您单击下一个字段集时，它会更改名称为“begin-time”的所有输入字段？

我想我错过了什么，但我不确定它是什么。

我有以下表格;

<form id="time-form">
  <fieldset>
    <div class="row">
      <input type="text" value="Jonh Doe" id="fullname" name="fullname" readonly="">
      <div class="time">
        <input type="text" value="00:00" id="begin-time" name="begin-time" readonly="">                     
        <input type="text" value="00:00" id="end-time" name="end-time" readonly="">                     
      </div>
  </fieldset>
  <fieldset>
    <div class="row">
      <input type="text" value="Jane Doe" id="fullname" name="fullname" readonly="">
      <div class="time">
        <input type="text" value="00:00" id="begin-time" name="begin-time" readonly="">                     
        <input type="text" value="00:00" id="end-time" name="end-time" readonly="">                     
      </div>
  </fieldset>
</form>

使用新表单'on tab';

<form id="add-time">
  <input type="time" name="begin_time">
  <input type="time" name="end_time">
</form>

和javascript;

$$('#time-form fieldset').tap(function() {  

var beginTime = $(this).find("[name='begin-time']");

$('#add-time input[name=begin_time]').change(function() {
    beginTime.val(this.value);
});

$$('.add-time').tap(function() {
    $('#addTimePage').addClass('pt-page-moveToRightEasing pt-page-ontop');
    $('#timePage').addClass('pt-page-moveFromLeft pt-page-current');

    setTimeout(function () { 
        $('#timePage').removeClass('pt-page-moveFromLeft');
        $('#addTimePage').removeClass('pt-page-moveToRightEasing pt-page-ontop pt-page-current');
    }, 400);
});
});

编辑：我设置了一个问题的简单fiddle。

Answer 1

好的，所以我注意到了一些问题：

您的第一次.click()来电定位所有时间表格字段集时，它应该只定位输入字段。
您的.change()和第二.click()在第一个.click()内被调用，这意味着将多次调用新方法（因为每次使用.click()和{{1}增加了实际的事件。
您的提交按钮实际上并未提交任何内容。它只是隐藏自己。

为了解决这个问题，我给每个字段集命名为.change()，以便它们可以轻松地循环。我为每个.fieldset-time＆gt;添加了onclick()个事件。轻松操纵被点击的那个（和它的孩子）。

以下是新的JavaScript代码：

<fieldset

新JSFiddle：http://jsfiddle.net/J4Hjf/7/

我希望你能找到的是什么。：）

更改选项卡上的输入值

1 个答案: