Question

事实上，我编辑了作者Eric Martin的样本HTML基本模板，并且dw。 为什么？以下是文件：http://communitychessclub.com/basic/index.html，所有需要的文件都已正确引用。

这是用于调用simplemodal的HTML：

<a href='#' class='basic' data-width="586" data-height="100">Demo</a>

这是弹出目标div：

<!-- modal content -->
<div id="basic-modal-content">
<p class="hyphenate"><span class="bold">George Carlin explains:</span> "Quality. Values. Style. Service. Selection. Convenience. Economy. Savings. Performance. Experience. Hospitality. Low rates. Friendly service. Name brands. Easy terms. Affordable prices. Money back guarantee. Free installation. Free admission. Free appraisal. Free delivery. Free alterations. Free home trial. And free parking.</p></div>

这是处理模态的javascript：

<script>
jQuery(function ($) {
$('#basic-modal .basic').click(function (e) {
    var hrefval= $(this).attr("href"); 
    var $this = $(this); 
    var height_len = $this.data("height");  
    var width_len = $this.data("width"); 

$('#basic-modal-content').modal(

containerCss:{
        backgroundColor:"#ccc",
        borderColor:"#ccc",
        border:5,
        padding:5,
        height:'height_len+20',
        width:'width_len+20'
        });
return false;
});
});
</script>

Answer 1

你错过了{} cus这会给出错误：

missing ) after argument list
[Afbreken op deze fout] containerCss: {

应该像containerCss一样：

jQuery(function($) {
    $('#basic-modal .basic').click(function(e) {
        var hrefval = $(this).attr("href");
        var $this = $(this);
        var height_len = $this.data("height");
        var width_len = $this.data("width");

        $('#basic-modal-content').modal(
        {
            containerCss: {
                backgroundColor: "#ccc",
                borderColor: "#ccc",
                border: 5,
                padding: 5,
                height: height_len+20,
                width: width_len+20
            }
        });
        return false;
    });
});

更新如何使用多个

<a href='#' class='basic' data-connection="dialog1" data-width="586" data-height="100">Demo</a>
<a href='#' class='basic' data-connection="dialog2" data-width="586" data-height="100">Demo</a>

The Boxes

<!-- modal content -->
<div id="dialog1"><p class="hyphenate">BOX 1</p></div>
<div id="dialog2"><p class="hyphenate">BOX 2</p></div>

脚本

jQuery(function($) {
    $('#basic-modal .basic').click(function(e) {
        var hrefval = $(this).attr("href");
        var $this = $(this);
        var height_len = $this.data("height");
        var width_len = $this.data("width");
        var id = $this.data("connection")

        $('#' + id).modal(
        {
            containerCss: {
                backgroundColor: "#ccc",
                borderColor: "#ccc",
                border: 5,
                padding: 5,
                height: height_len+20,
                width: width_len+20
            }
        });
        return false;
    });
});

simplemodal没有获取数据高度和数据宽度

1 个答案: