1. 程式人生 > >layui中彈出iframe層時將彈出層的儲存按鈕繫結為iframe中表單的提交按鈕的方法

layui中彈出iframe層時將彈出層的儲存按鈕繫結為iframe中表單的提交按鈕的方法

 彈出層提交表單的js

layer
			.open({
				type : 2,
				title : '新增許可權',
				area : [ '500px', '450px' ],
				offset : '160px',
				shadeClose : true, // 點選遮罩關閉
				btn : ['儲存','取消'],
				content : 'permission_add.html',
				success : function(layero, index) { // 成功彈出後回撥
					
				},
				yes : function(index, layero) { // 儲存按鈕回撥函式
                                    // 獲取iframe層的body
				    var body = layer.getChildFrame('body', index);
                                    // 找到隱藏的提交按鈕模擬點選提交
				    body.find('#permissionSubmit').click();
				},
				btn2 : function(index, layero) { // 取消按鈕回撥函式
					layer.close(index); // 關閉彈出層
				}
			});

彈出層表單中隱藏的提交按鈕程式碼

<div class="layui-form-item" hidden>
    <div class="layui-input-block">
        <button id="permissionSubmit" class="layui-btn" lay-submit lay-filter="*">
        儲存
        </button>
    </div>
</div>

js中重要的就是這兩句程式碼

yes : function(index, layero) { // 儲存按鈕回撥函式
				    var body = layer.getChildFrame('body', index);
				    body.find('#permissionSubmit').click();
				}

我們只需要在儲存按鈕的回撥函式中獲取到iframe頁面的隱藏的提交按鈕然後使用click()事件就可以提交彈出iframe層的表單了,並且可以觸發表單驗證,親測有效哦