Question

我已经看到了以下链接，但它对我不起作用。 jQuery Mobile SimpleDialog with two Inputs?

任何人都可以通过查看以下代码来帮助我。

<script type="text/javascript"> 
            $(document).delegate('#addDialog', 'click', function() {
                $(this).simpledialog({
                    'mode' : 'string',
                    'prompt' : 'Product',
                    'cleanOnClose': true,
                    'buttons' : {
                        'OK': {
                            click: function () { 
                                $('#simplestringout').text($('#addDialog').attr('data-string'));
                            }
                        },
                        'Cancel': {
                            click: function () { console.log(this); },
                            icon: "delete",
                            theme: "c"
                        }
                    }
                })
            });
        </script>

我通过点击按钮调用此功能。

在这里，我完全成为一个文本框。但是当我想要两个文本文件时，我无法得到它。

任何人都可以帮我解决如何获取两个文本框的问题。

Answer 1

我认为要获得2个输入，您需要使用空白模式并创建所需的对话框标记。

下面是一个示例，其中blankContent属性用于将带有2个输入和2个按钮的标记注入对话框。然后使用事件委托（.on（））为OK按钮添加处理程序，因为在启动对话框之前该按钮不存在：

$(document).on("pageinit", "#page1", function () {
    $(document).on("click", "#openDialog", function () {
        $('<div>').simpledialog2({
            mode: 'blank',
            headerText: 'Product',
            headerClose: true,
            width: "75%",
            blankContent: '<div class="sdCont"><label for="inp1">Text input 1:</label><input id="inp1" type="text" value="" placeholder="Type something..." /><label for="inp2">Text input 2:</label><input id="inp2" type="text" value="" placeholder="Really, go ahead and type..." /><div class="ui-grid-a"><div class="ui-block-a"><button id="btnOK" data-inline->OK</button></div><div class="ui-block-b"><button id="btnCancel" data-theme="c" data-icon="delete" rel="close">Cancel</button></div></div></div>'
        });
    });

    $(document).on("click", "#btnOK", function(){
        alert("Dialog OK clicked!");
        $.mobile.sdCurrentDialog.close();
    });
});

这是 DEMO

如何在Jquery mobile中使用simpledialog创建两个文本框

1 个答案: