0

我在页面上有许多可点击的图像/按钮，它们具有以下内容（使用 Prototype.js）。

    $$( '.lbrchk' ).each( function ( name ) {
        name.observe( 'click' , function ( ev ) {
          var form = new Element( 'form',
                                    {
                                      method: 'post',
                                      action: 'url',
                                    });

            form.insert(new Element( 'input',
                                      {
                                        name: 'user',
                                        value: $(this).down( "input[name=user]" ).value,
                                        type: 'hidden'
                                      }));

            form.insert(new Element( 'input',
                                      {
                                        name: 'pin',
                                        value: '',
                                        type: 'password'
                                      }));

            form.insert(new Element( 'input',
                                      {
                                        type: 'submit',
                                        value: 'Submit',
                                       'class': 'processing'
                                      }));

            $('modal-content').insert(form); 
            $('modal').show();
            $('modal-content').down("input[name=user]").focus();

        });
    });

和其他有这个的。

$$( '.lbrinq' ).each( function ( name ) {
    name.observe( 'click' , function ( ev ) {
        var form = new Element( 'form',
                                {
                                  method: 'post',
                                  action: 'url'
                                });

            form.insert(new Element( 'input',
                                  {
                                    name: 'document',
                                    value: $(this).down("input[name=document]").value,
                                    type: 'hidden'
                                  }));

             $(document.body).insert(form);
             form.submit(); 

    });
});

两者相似，但一个创建一个模式表单，在提交之前要求用户输入，另一个创建表单元素并在单击按钮/图像时实用地提交表单。

我需要添加一个提交事件处理程序以仅允许提交一个表单。由于这些表单是动态创建的，所以我尝试的一切都以一种或另一种方式失败。

我试过改变

    var form = new Element( 'form',
                            {
                              method: 'post',
                              action: 'url'
                            });

至

    var form = new Element( 'form',
                            {
                              method: 'post',
                              action: 'url',
                              onsubmit: 'alert("hi");return false;'
                      //also  onsubmit: function(){ alert("hi" ); }

                            });

我还尝试向文档添加提交侦听器

 document.observe( 'submit', function( e, el ) {

    if ( el = e.findElement( 'form' ) ) {

          // Disable  all submit buttons
          $$( 'input[type="submit"]' ).invoke( 'disable' );         

          // If no previous submissions detected go ahead
            if( subck == 0){
              // show loading graphic to user
              $('processing_gif').show();

                  subck = 1;
                 return true;  // jump out of logic to continue normal operation
            } else { // Previous submission detected

              // Stop right here to prevent multiple submissions.
                e.stop();       
        }
    }
  });

在 Firefox 中有效，但在 IE 8/9 中无效。

有人对如何处理动态创建的表单上的“提交”事件有任何建议吗？

4

0 回答 0