2009-10-15 3 views
0

У меня есть следующие функции:Доступ к функции из нескольких форм на одной странице

<script type="text/javascript"> 
     $(function(){ 
      // start a counter for new row IDs 
      // by setting it to the number 
      // of existing rows 
      var newRowNum = 2; 

      // bind a click event to the "Add" link 
      $('#addnew').click(function() { 
       // increment the counter 
       newRowNum += 1; 

       // get the entire "Add" row -- 
       // "this" refers to the clicked element 
       // and "parent" moves the selection up 
       // to the parent node in the DOM 
       var addRow = $(this).parent().parent(); 

       // copy the entire row from the DOM 
       // with "clone" 
       var newRow = addRow.clone(); 

       // set the values of the inputs 
       // in the "Add" row to empty strings 
       //$('input', addRow).val(''); 
       //$('name', addRow).val('os' + newRowNum); 

       // replace the HTML for the "Add" link 
       // with the new row number 
       $('td:first-child', newRow).html('<input type="hidden" name="on' + newRowNum + '" value="Email Address ' + (newRowNum - 1) + '">Recipient'); 

       // insert a remove link in the last cell 
       $('td:last-child', newRow).html('<a href="" class="remove">Remove<\/a>'); 

       // loop through the inputs in the new row 
       // and update the ID and name attributes 

       $('input:hidden', newRow).attr('id','on' + newRowNum).attr('name','on' + newRowNum); 
       $('input:text', newRow).attr('id','os' + newRowNum).attr('name','os' + newRowNum); 

       // insert the new row into the table 
       // "before" the Add row 
       addRow.before(newRow); 
       document.tp01.quantity.value = newRowNum-1; 
       // add the remove function to the new row 
       $('a.remove', newRow).click(function(){ 
        $(this).parent().parent().remove(); 
        return false;    
       }); 

       // prevent the default click 
       return false; 
      }); 
     }); 

     </script> 

Эта функция вызывается, нажав на ссылку в виде (эта функция добавляет или удаляет строки из таблицы). Ссылка выглядит следующим образом:

<a id="addnew" href="">Add</a> 

мне нужно поставить больше форм на той же странице, доступ по ссылке в каждой из этих форм, является, насколько пользователь обеспокоен, точно так же, как показано выше. Может ли кто-нибудь сделать предложения о том, как я могу повторно использовать одну и ту же функцию для этого?

Благодаря

Dave

ответ

0

переместить встроенный скрипт во внешний файл JS:

var newRowNum = 2; 

var bindLink = function(linkSelector) 
{ 
    // bind a click event to the "Add" link 
    $(linkSelector).click(function() { 
     ... 
    } 
} 

Тогда вместо встроенного скрипта поместить вызов bindLink ('# AddNew') в ваш готовый обработчик.

+0

Итак, чтобы быть понятным, я перемещаю текущий скрипт из встроенного в внешний (я собирался сделать это в конце концов, но это не должно иметь никакого значения, если он встроен или внешний, не так ли?). Затем я помещаю вышеуказанный код во внешний скрипт JS? Или я добавляю то, что у вас выше, к текущему сценарию? Dave – Dave

+0

Я бы включил вызов bindLink(), поскольку идентификатор ('#id'), переданный для каждой ссылки, был бы другим. Я полагаю, вы могли бы дать каждой ссылке один и тот же идентификатор, а затем вы можете переместить вызов bindLink во внешний скрипт. –

+0

Также уточнить: старая функция была вызвана простым Add Теперь мне нужно сделать onclick = "javascript ..." или я могу позвонить ему с Add, а затем Add и т. Д.? Спасибо за помощь. Dave – Dave

Смежные вопросы