j查询对话框在按回车键时不起作用

jQuery dialog not working when pressing Enter Key

本文关键字:不起作用 回车 查询 对话框      更新时间:2023-09-26

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<form action="" id="formID" name="formID" >
    <input type="text" id="filename" class="validate[required]"/>
    <script type="text/javascript">
        $('#filename').keypress(function(event){
            var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == '13'){
                alert("Enter");
                var val = $("#filename").val();
                if (val != '') {                         
                    var rev_str = val.split('').reverse().join('');             
                    var char0 = rev_str.charAt(0);
                    var char1 = rev_str.charAt(1);
                    var char2 = rev_str.charAt(2);
                    var char3 = rev_str.charAt(3);
                    var sumchar = char0 + char1 + char2 + char3;
                    alert(sumchar);
                    if (sumchar != "txt.") {
                        if (sumchar != "TXT.") {
                            alert(sumchar + "   "  + "1");
                            $("#dialogmsg").dialog({
                                modal : true,
                                draggable : false,
                                resizable : false,
                                show : 'blind',
                                hide : 'blind',
                                width : 200,
                                dialogClass : 'osx',
                                buttons : {
                                    " Back " : function() {
                                        $(this).dialog("close");
                                        $("#filename").focus();
                                        $("#filename").val("");
                                    }
                                }
                            });
                        } else {
                            alert("salam1");
                            $("#formID").submit();
                        }
                    } else {
                        alert("salam2");
                        $("#formID").submit();
                    }
                }
            }
            event.stopPropagation();
        });
    </script>
    
    <button type="button" id="click"> OK </button>
</form>
<div id="dialogmsg" class="dialogmsg" title=" Warning " style="display: none;"
    align="center">
    <span style="color: red;"> Is Not Valid </span>
</div>

您需要包含 jQuery UI 库和 CSS 主题才能使对话框正常工作。

请注意,.dialog()是 jQuery UI 的一部分。

工作代码片段:

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<form action="" id="formID" name="formID" >
    <input type="text" id="filename" class="validate[required]"/>
    <script type="text/javascript">
        $('#filename').keypress(function(event){
            var keycode = (event.keyCode ? event.keyCode : event.which);
            if(keycode == '13'){
                alert("Enter");
                var val = $("#filename").val();
                if (val != '') {                         
                    var rev_str = val.split('').reverse().join('');             
                    var char0 = rev_str.charAt(0);
                    var char1 = rev_str.charAt(1);
                    var char2 = rev_str.charAt(2);
                    var char3 = rev_str.charAt(3);
                    var sumchar = char0 + char1 + char2 + char3;
                    alert(sumchar);
                    if (sumchar != "txt.") {
                        if (sumchar != "TXT.") {
                            alert(sumchar + "   "  + "1");
                            $("#dialogmsg").dialog({
                                modal : true,
                                draggable : false,
                                resizable : false,
                                show : 'blind',
                                hide : 'blind',
                                width : 200,
                                dialogClass : 'osx',
                                buttons : {
                                    " Back " : function() {
                                        $(this).dialog("close");
                                        $("#filename").focus();
                                        $("#filename").val("");
                                    }
                                }
                            });
                        } else {
                            alert("salam1");
                            $("#formID").submit();
                        }
                    } else {
                        alert("salam2");
                        $("#formID").submit();
                    }
                }
            }
            event.stopPropagation();
        });
    </script>
    
    <button type="button" id="click"> OK </button>
</form>
<div id="dialogmsg" class="dialogmsg" title=" Warning " style="display: none;"
    align="center">
    <span style="color: red;"> Is Not Valid </span>
</div>

Readup: .dialog() | jQuery UI