今天有個需要，使用者進入頁面的時候，彈出一個彈窗，彈窗中選擇一個時間，彈窗大概是這樣的：

我的思路是，先在頁面寫好彈窗內容，然後使用lay.open設定content即可：

<div id="layopen">
    時間：<input type="text" id="time"></input>
</div>

layer.open({
    content: $("#layout").html(),
    success: function(){
        laydate({
            "elem": "#time"
 

        });
    }
});

執行，發現無論怎麼點選輸入框，時間控制元件都出不來，也就是說，這種寫法下，laydate失效了。然後在官網中找到一個帖子上說，把content: $("#layout").html()改成content: $("#layout")即可，驚喜的發現真的可以，效果如下：

效果是實現了，可是頂部的[object object]是什麼鬼？

一開始，通過css將頂部的[object object]隱藏了，但是總覺得很彆扭。然後經過一番折騰之後發現，其實只要指定下層的型別為頁面層就可以完美的解決這個問題：

layer.open({
    layer
 
: 1,
    content: $("#layout").html(),
    success: function(){
        laydate({
            "elem": "#time"
        });
    }
});

注：使用的版本分別為layer3.x.x.，laydate1.x.x，其他版本搭配是否可以直接設定時間未測試。