我想把一个jQuery的功能在另一个功能

Question

我从一个文本框中获取值并将其放入另一个文本框中。正在传输的值是一个问题的持续时间，并且两个文本框都使用jQuery timepicker插件。现在这适用于第一个文本框，但它不适用于第二个文本框。我想在第二个文本框旁边包含一个按钮，以便用户可以打开时间选择器，以防用户想要更改第二个文本框中的持续时间。

所以我想包括下面这timepicker功能：

$(document).ready(function() { 
    $(function() { 
     $('#questiondurationpickerRow').trenttimepicker({ 
      timeFormat: 'hh mm ss', 
      hourGrid: 4, 
      minuteGrid: 10, 
      secondGrid: 10, 
      showOn: 'button', 
      buttonImage: "Images/clock.gif", 
      buttonImageOnly: true 
     }); 
    }); 
}); 

到下面的InsertQuestion（形式）功能：

var qnum = 1; 

function insertQuestion(form) { 
    var $tr = $("<tr></tr>"); 
    var $duration = $("<td class='duration'></td>"); 

    $('#questiondurationpicker').each(function() { 
     var $this = $(this); 
     var $durationText = 
      $("<input type='text' id='questiondurationpickerRow' readonly='readonly' />") 
       .attr('name', $this.attr('name')) 
       .attr('value', $this.val()) 

     $duration.append($durationText); 
    }); 

    $tr.append($qid); 
    $tr.append($duration) 
    $('#qandatbl').append($tr); 

    form.numberOfQuestions.value = qnum; 

    ++qnum; 
    $("#questionNum").text(qnum); 
    form.questionText.value = ""; 
} 

什么是该做的是显示timepicker按钮我在“#questiondurationpickerRow”文本框旁边创建，以便用户可以单击该按钮并打开时间选择器以打开持续时间。

我试图把“questiondurationpickerRow”timepicker函数放在insertQuestion（表单）函数中，但它不显示按钮。下面是我的尝试：

var qnum = 1; 

function insertQuestion(form) { 
    $(document).ready(function() { 
     $(function() { 
      $('#questiondurationpickerRow').trenttimepicker({ 
       timeFormat: 'hh mm ss', 
       hourGrid: 4, 
       minuteGrid: 10, 
       secondGrid: 10, 
       showOn: 'button', 
       buttonImage: "Images/clock.gif", 
       buttonImageOnly: true 
      }); 
     }); 
    }); 

    var $tr = $("<tr></tr>"); 
    var $duration = $("<td class='duration'></td>"); 

    $('#questiondurationpicker').each(function() { 

     var $this = $(this); 
     var $durationText = 
     $("<input type='text' id='questiondurationpickerRow' readonly='readonly' />") 
      .attr('name', $this.attr('name')) 
      .attr('value', $this.val()) 

     $duration.append($durationText); 
    }); 

    $tr.append($qid); 
    $tr.append($duration) 
    $('#qandatbl').append($tr); 

    form.numberOfQuestions.value = qnum; 

    ++qnum; 
    $("#questionNum").text(qnum); 
    form.questionText.value = ""; 
} 

我怎么能包括“questiondurationpickerRow” timepicker功能在insertQuestion（）函数，以便它旁边会显示一个文本框中timepicker按钮？

Answer 1

此：

function insertQuestion(form) { 
    $(document).ready(function() { 
     $(function() { 
      $('#questiondurationpickerRow').trenttimepicker({ 

所有你需要的是：

function insertQuestion(form) { 
    $('#questiondurationpickerRow').trenttimepicker({ 

我没有看到一个定义

$tr.append($qid); 

的$ QID

一个很难去猜测什么).trenttimepicker确实。

编辑：

综观：

$('#questiondurationpicker').each(function() { 
    var $this = $(this); 
    var $durationText = 
      $("<input type='text' id='questiondurationpickerRow' readonly='readonly' />") 
      .attr('name', $this.attr('name')) 
      .attr('value', $this.val()) 
     $duration.append($durationText); 
}); 

这更有意义（并修正语法错误）

来做为：

$this = $('#questiondurationpicker'); 
    var $durationText = $("<input type='text' id='questiondurationpickerRow' readonly='readonly' />") 
     .attr('name', $this.attr('name')) 
     .attr('value', $this.val()); 
    $duration.append($durationText); 

重：缺少半冒号 只有一个元素可以存在给定的ID，所以不需要each()东西

最终返工：

var qnum = 1; 

function insertQuestion(form) { 
    var $tr = $("<tr></tr>"); 
    var $duration = $("<td class='duration'></td>"); 

    $this = $('#questiondurationpicker');//assume this exists 
    var $durationText = $("<input type='text' id='questiondurationpickerRow' readonly='readonly' />").attr('name', $this.attr('name')).attr('value', $this.val());//was issing semi colon 
    $duration.append($durationText); 

    $tr.append($qid);//assume $qid exists and is an element 
    $tr.append($duration) $('#qandatbl').append($tr); 
    form.numberOfQuestions.value = qnum;//another assumption 
    ++qnum; 
    $("#questionNum").text(qnum);// assume this exists 
    form.questionText.value = "";//assume this exists 

    // This has to be after it gets inserted 
    $('#questiondurationpickerRow').trenttimepicker({ 
     timeFormat: 'hh mm ss', 
     hourGrid: 4, 
     minuteGrid: 10, 
     secondGrid: 10, 
     showOn: 'button', 
     buttonImage: "Images/clock.gif", 
     buttonImageOnly: true 
    }); 
} 

下面是使用jQuery UI日期选择器一个SAMPE页： http://jsfiddle.net/MarkSchultheiss/Mykd6/