SimpleModal-打开加载 [英] SimpleModal -- Open OnLoad

查看:101
本文介绍了SimpleModal-打开加载的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是JQuery的新手,而不是javascript的新手.

I'm new to JQuery -- not new to javascript.

能够使用演示index.html页面中提供的超链接按钮打开OSX样式对话框,但希望在页面加载时将其打开.我在StackOverflow上阅读了几个链接(如何做我在页面加载时调用SimpleModal OSX对话框吗?),但仍然无法在完全相同的index.html页面上运行它.最后,我通过编程调用隐藏的按钮元素的按钮单击来采取权宜之计,请参见以下片段:

Was able to open the OSX STYLE DIALOG using the hyperlink button provided in the demo index.html page, but would like to open it on the page load. I read a couple links on StackOverflow (How do I invoke a SimpleModal OSX dialog on page load?), but still could not get it to work in the exact same index.html page. I finally resorted to a stopgap measure by programmatically invoking the button click of a hidden button element -- see following fragment:

onLoad="document.getElementById('load_OSX_Example').click();">
<input type="hidden" id="load_OSX_Example" value="" class='osx'>

<script type="text/javascript" language="javascript">
    //#### open the OSX Modal  ##########
    $(document).ready(function(){
       $("#osx-modal-content").modal();
    });
</script>

所以我有两个问题:

  1. 如何使用javascript/html以编程方式调用class ='osx'?
  2. 为什么不能使用$(#osx-modal-content").modal();来工作?调用javascript(请参见上面的片段)?我在多个浏览器中尝试过此操作,并且屏幕上显示的唯一内容是此标记的内容:"div id ="osx-modal-title",并且jscript控制台中没有错误.

推荐答案

条例草案

如果您希望对话框在页面加载时打开,有两个选项.您可以直接编辑osx.js文件,也可以在加载osx.js文件后添加以下内容:

If you want the dialog to open on page load, there are a couple of options. You can edit the osx.js file directly, or after you've loaded the osx.js file, add the following:

<script type='text/javascript'>
jQuery(function ($) {
    $("#osx-modal-content").modal({
        overlayId: 'osx-overlay',
        containerId: 'osx-container',
        closeHTML: '<div class="close"><a href="#" class="simplemodal-close">x</a></div>',
        minHeight:80,
        opacity:65, 
        position:['0',],
        overlayClose:true,
        onOpen:OSX.open,
        onClose:OSX.close
    });
});
</script>

这篇关于SimpleModal-打开加载的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆