Question

我想只在用户输入可接受时才显示div标签。

这是我的index.php文件

<html>
<head>
<script type="text/javascript" src="../js/jquery.js"></script>
<script>
    function validate_group_name(value){
        $.post("validate_group_name.php",{group_name:value},function(data){
            $(".validate_group_name").html(data);
        });
    }
</script>
</head>
<body>
    <input type="text" name="group_name" id="group_name" onkeyup="validate_group_name(this.value)">
    <span class="validate_group_name"></span>

    <div id="display_sometimes" style="display:none;">
        This text only displays sometimes.
    </div>
</body>
</html>

这是我的validate_group_name.php文件

<?php
    mysql_connect("servername ", "username", "password") or die(mysql_error());
    mysql_select_db("database") or die(mysql_error());
    $group_option = $_POST['group_name'];
    $len = strlen($group_option);
    $groups = mysql_query("SELECT name FROM groups");
    $go = 0;
    while($group = mysql_fetch_array($groups)) {        
        if(strtolower($group['name']) == strtolower($group_option)){
            $go++; //check if group already exists
        }       
    }

    if(!preg_match("/^[a-zA-Z0-9 ]*$/", $group_option)){
        echo "<span style='color: red;'>" . "Invalid Group Name." . "</span>";
    } else if($len < 3){
        echo "<span style='color: red;'>" . "Your group name must be greater than 2 characters." . "</span>";
    } else if($go != 0){
        echo "<span style='color: red;'>" . "That group name already exists." . "</span>";
    } else {
        echo "<span style='color: green;'>" . "That group name is available." . "</span>";
    }
?>

是否可以创建一个javascript函数来检测从id＆＃34; validate_group_name＆＃34;输出的文本。

我已经能够使用此功能使div标签可见，但它不会检查组名是否可用，并且在键入时也不会检测到更改。

$(document).ready(
    function(){
        $('#group_name').change(
            function(){
                if ($(this).val()) {
                    $('#display_sometimes').css('display','block');
                    $('#display_sometimes').css('width','100%');
                    $('#display_sometimes').css('height','200px');
                } 
            }
            );
    });

感谢您的帮助。

Answer 1

您可以在AJAX（.post()）方法的成功回调函数中执行此操作：

function validate_group_name(value){
    $.post("validate_group_name.php",{group_name:value},function(data){
        $(".validate_group_name").html(data);
        if (data=="Bob Smith"){
            $('#display_sometimes').show().css({'width':'100%', 'height':'200px'});
        }
    });
}

仅当用户输入正确时，才允许html标记可见

1 个答案: