我在页面上有许多可点击的图像/按钮,它们具有以下内容(使用 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 中无效。
有人对如何处理动态创建的表单上的“提交”事件有任何建议吗?