提交后如何禁用输入字段

时间:2019-04-06 21:26:07

标签: javascript php jquery html laravel

在点击提交按钮后,我需要帮助禁用输入字段。我当前正在使用Laravel,所以不确定jQuery是否位于视图之外的其他位置。我尝试将jQuery代码放在index.blade.php,中,但是没有用。

<script type="text/javascript">
    $(document).onclick(function(){
         $("#pid :input").prop("disabled", true);
    });
</script>

2 个答案:

答案 0 :(得分:2)

只需监听提交单击,然后设置输入的布尔值disabled

$("#submit").on("click", function() {
    $("#pid").attr("disabled", "disabled");
});

答案 1 :(得分:1)

检查我的代码。我创建了一个表单和输入元素的示例。

有关序列化的更多信息,请检查此link

您将使用ajax将输入元素的值发送到file.php,然后来自file.php的echo将发送给ajax调用该数据,并将数据打印在控制台中。

此后,输入字段将被禁用。

file.php

<?php 
header('Access-Control-Allow-Origin: *');

if(isset($_GET['nm'])){
    $name = $_GET['nm'];

    echo $name;
}

?>

$("#frm1").submit(function(e){

     //make sure you have name value in each input element
     $.ajax({
        method:'get',
        url:'http://localhost/file.php',
        data:$(this).serialize()
     }).done(function( data ) {
         console.log(data);
     }).fail(function( jqXHR, textStatus ) {
         alert( "Request failed: " + textStatus );
     });

     //after submit disable the input elememt
     $("#nm").prop("disabled", true);

     e.preventDefault();
     
});  	
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="frm1" action="" method="post">
    <input type="text" id="nm" name="nm" />
    <input type="submit" value="Submit"/>
</form>