JS中artdialog彈出框控件之提交表單思路詳解

字號(hào):


    artDialog是一個(gè)基于javascript編寫的對(duì)話框組件,它擁有精致的界面與友好的接口。
    前言:
    自適應(yīng)內(nèi)容
    artDialog的特殊UI框架能夠適應(yīng)內(nèi)容變化,甚至連外部程序動(dòng)態(tài)插入的內(nèi)容它仍然能自適應(yīng),因此你不必去考慮消息內(nèi)容尺寸使用它。它的消息容器甚至能夠根據(jù)寬度讓文本居中或居左對(duì)齊——這一切全是XHTML+CSS原生實(shí)現(xiàn)。
    完善的接口
    它的接口完善,可以輕易與外部程序配合使用。如異步寫入消息、控制位置、尺寸、顯示與隱藏、關(guān)閉等。
    細(xì)致的體驗(yàn)
    如果不是在輸入狀態(tài),它支持Esc快捷鍵關(guān)閉;可指定在元素附近彈出,讓操作更便捷;智能給按鈕添加焦點(diǎn);黃金比例垂直居中;超大響應(yīng)區(qū)域特別為ipad等觸屏設(shè)備優(yōu)化;預(yù)先緩存皮膚圖片更快響應(yīng)……
    跨平臺(tái)兼容
    兼容:IE6+、Firefox、Chrome、Safari、Opera以及iPad等移動(dòng)設(shè)備。并且IE6下也能支持現(xiàn)代瀏覽器的靜止定位(fixed)、覆蓋下拉控件、alpha通道png背景。
    步入正題:
    artdialog 不錯(cuò)的彈出框控件
    接觸artdialog已經(jīng)有一段時(shí)間了,覺得其用起來還不錯(cuò),比較輕量級(jí),javascript的插件我比較喜歡輕量級(jí)的,加載速度快。
    其功能也很不錯(cuò),功能很齊全,相對(duì)于其它彈出插件,這個(gè)插件不僅還在維護(hù),而且bug也少,用起來也挺方便,是國內(nèi)比較出眾的插件之一。
    調(diào)用方法如下:
    //說明下面是一段通過artdialog彈出form表單,并通過ajaxform來提交的js(表單可以采用jquery validate驗(yàn)證控件來驗(yàn)證表單)
    $(document).ready(function() {
    var options = {
    target: '#output2',
    success: showResponse // post-submit callback
    };
    $('#myForm').ajaxForm(options);
    var alt =null;
    $("#addHname").click(function(){
    alt=art.dialog({
    title:'新增花名',
    content: document.getElementById('g_cn'),
    width:750,
    button: [
    {
    name: '保存',
    focus: true,
    callback: function () {
    $('#myForm').submit();
    return false;
    }
    },
    {
    name: '關(guān)閉',
    callback: function () {
    }
    }
    ]
    });
    });
    function showResponse(data){
    if(alt !=null){
    alt.close();
    }
    if(data=='success'){
    artDialog.alert('保存成功');
    }else{
    art.dialog.close();
    artDialog.alert('保存失敗');
    }
    }
    });
    以上所述是小編給大家介紹的JS中artdialog彈出框控件之提交表單思路詳解,希望對(duì)大家有所幫助!