我想把一個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/