簡體   English   中英

使用 javascript 根據用戶類型隱藏/取消隱藏文本字段?

[英]Hide/ unhide text fields based on user type using javascript?

加載表單頁面時,它會自動將用戶帳戶的類型從數據庫中提取到名為 check_type 的文本字段中。 我想根據用戶帳戶類型隱藏/取消隱藏文本字段。 如果是管理員帳戶,則顯示 textfield1,對於任何其他帳戶,鍵入 hide textfield1。

這是我寫的代碼; 但是,它不起作用。 也許,我使用了不正確的語法。

 <?php
// Include config file
require_once "config.php";

$sql="SELECT * FROM users WHERE username = '$user' ";
$result = mysqli_query($mysqli,$sql);

while($row = mysqli_fetch_array($result)) {

$type = $row['acct_type'];


}
                    
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Hide/ Unhide</title>

<script language="javascript" type="text/javascript">
 $(document).ready(function() {

    var check_type = document.getElementById("check_type");
    var atype = document.getElementById("atype");

    if(check_type == 'Admin')
    {
        atype.style.display = "block";
    }
    
    else 
    {
         atype.style.display = "none";
        
        }
});


</script>

</head>

<body>


<form>
        
        <div>
        <input name="check_type" id="check_type" type="hidden" value="<?php echo $type; ?>">
        </div>
        
        <div class="form-group">
        <label>Account Type</label>
        <select type="text" name="atype" id="atype" class="form-control" value="<?php echo $atype; ?>">
        <option value="<?php echo $atype; ?>" selected><?php echo $atype; ?></option>
                  <option value="User">User</option>
                  <option value="Admin">Admin</option>
                  
                </select>
        
        <span></span>
        </div>
        <div>
        <input type="submit" id="submit" value="Submit"/>
        </div>

</form>



</body>
</html>

您需要檢查check_type的值。 但這取決於您用於 check_type 的元素類型。 如果它的輸入類型那么,否則為innerHTML

更新

類型:管理員

 $(document).ready(function() { // Input Type var check_type = document.getElementById("check_type"); var textfield1 = document.getElementById("atype"); if(check_type.value == 'Admin') { textfield1.style.display = "block"; } else { textfield1.style.display = "none"; } });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form> <div> <input name="check_type" id="check_type" type="hidden" value="Admin"> </div> <div class="form-group"> <label>Account Type</label> <select type="text" name="atype" id="atype" class="form-control"> <option value="User">User</option> <option value="Admin">Admin</option> </select> </div> <div> <input type="submit" id="submit" value="Submit"/> </div> </form>

類型:用戶

 $(document).ready(function() { // Input Type var check_type = document.getElementById("check_type"); var textfield1 = document.getElementById("atype"); if(check_type.value == 'Admin') { textfield1.style.display = "block"; } else { textfield1.style.display = "none"; } });
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form> <div> <input name="check_type" id="check_type" type="hidden" value="User"> </div> <div class="form-group"> <label>Account Type</label> <select type="text" name="atype" id="atype" class="form-control"> <option value="User">User</option> <option value="Admin">Admin</option> </select> </div> <div> <input type="submit" id="submit" value="Submit"/> </div> </form>

只需在您的 get 元素中添加值即可獲取元素值嘗試:

check_type.value

<script language="javascript" type="text/javascript">
 $(document).ready(function() {

    var check_type = document.getElementById("check_type");
    var textfield1 = document.getElementById("textfield1");

    if(check_type.value == 'Admin')
    {
        textfield1.style.display = "block";
    }
    
    else 
    {
         textfield1.style.display = "none";
        
        }
});


</script>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM