Javascript 如果用户名已经存在于数据库中，如何禁用表单提交按钮？（由js、ajax、php（laravel）编写）

我是新的js学习者，我正在尝试构建一个表单。在表单中，我想检查输入用户名是否已经存在，我已经通过laravel controller和lil JS代码完成了这项工作，但是如果数据库中已经存在输入用户名，我想隐藏submit按钮。那我该怎么做呢？请任何人

这是我的JS代码

<script type="">

$function get_user_name(id, result) {
  var id = $(id).val();
  $.get("<?php echo e(url('home/get_user_name')) ?>/" + id,
  function (data) {
    $(result).html(data);
  });
}
</script>

html表单=>

    <span id="username_rs" style="color: green; font-weight: bold"></span>//showing the message here,

<input id="username" name="username"

           onchange="checkem('#username', '#username_rs')" >


<button type="submit" class="btn btn-primary">
            {{ __('Register') }}
          </button>

url看起来像=>

http://localhost/home/get_user_name/{input username}

---

我的代码显示用户名是否被使用，但如果用户名被使用或存在于数据库中，我想隐藏提交按钮。

您可以这样返回：

**and 
controller =** 

public function get_user_name()
  {
     $username = request()->segment(3);
    $user = DB::table('users')
    ->select('username')
    ->where('username', $username)
    ->count();

    if ($user >0) {
      return Response::json(array("found"=>"yes", "message"=>"Username is already taken"));       
    }else{
       return Response::json(array("found"=>"no", "message"=>"Something happens wrong"));
    }
  }

function get_user_name(id, result) {
  var id = $(id).val();
  $.get("<?php echo e(url('home/get_user_name')) ?>/" + id,
  function (data) {
    //check if we get the message: username already taken
    if(data) {
      $(result).html(data);
      $('input[type=submit]', this).attr('disabled', 'disabled'); //disable button
      $('form').bind('submit',function(e){e.preventDefault();}); //disable form
    } else {
      $('input[type=submit]', this).removeAttr('disabled', 'disabled'); //enable button
      $('form').unbind('submit'); //enable form
    }
  });
}

您的脚本代码如下所示：

$function get_user_name(id, result) {
  var id = $(id).val();
  $.get("<?php echo e(url('home/get_user_name')) ?>/" + id,
  function (data) {
     if (data.found == 'yes)
     {
        $("#submit_btn").css("display","none")
     }
  });
}

<span id="username_rs" style="color: green; font-weight: bold"></span>//showing the message here,

<input id="username" name="username"

           onchange="checkem('#username', '#username_rs')" >


<button type="submit" id="submit_btn" class="btn btn-primary">
            {{ __('Register') }}
          </button>

$function get\u user\u name（id，result）{
var id=$（id）.val（）；
$.get（“/”+id，
功能（数据）{
如果（data.found=='是）
{
$（“提交”）.css（“显示”、“无”）
}
});
}

HTML代码如下所示：

$function get_user_name(id, result) {
  var id = $(id).val();
  $.get("<?php echo e(url('home/get_user_name')) ?>/" + id,
  function (data) {
     if (data.found == 'yes)
     {
        $("#submit_btn").css("display","none")
     }
  });
}

<span id="username_rs" style="color: green; font-weight: bold"></span>//showing the message here,

<input id="username" name="username"

           onchange="checkem('#username', '#username_rs')" >


<button type="submit" id="submit_btn" class="btn btn-primary">
            {{ __('Register') }}
          </button>

//在此处显示消息，
{{{（'Register'）}

我会这样做：

**and 
controller =** 

public function get_user_name()
  {
     $username = request()->segment(3);
    $user = DB::table('users')
    ->select('username')
    ->where('username', $username)
    ->count();

    if ($user >0) {
      return Response::json(array("found"=>"yes", "message"=>"Username is already taken"));       
    }else{
       return Response::json(array("found"=>"no", "message"=>"Something happens wrong"));
    }
  }

function get_user_name(id, result) {
  var id = $(id).val();
  $.get("<?php echo e(url('home/get_user_name')) ?>/" + id,
  function (data) {
    //check if we get the message: username already taken
    if(data) {
      $(result).html(data);
      $('input[type=submit]', this).attr('disabled', 'disabled'); //disable button
      $('form').bind('submit',function(e){e.preventDefault();}); //disable form
    } else {
      $('input[type=submit]', this).removeAttr('disabled', 'disabled'); //enable button
      $('form').unbind('submit'); //enable form
    }
  });
}

函数获取用户名称（id、结果）{
var id=$（id）.val（）；
$.get（“/”+id，
功能（数据）{
//检查我们是否收到消息：用户名已被占用
如果（数据）{
$（结果）.html（数据）；
$（'input[type=submit]'，this.attr（'disabled'，'disabled'）；//禁用按钮
$（'form'）.bind（'submit'，函数（e）{e.preventDefault（）；}）；//禁用表单
}否则{
$（'input[type=submit]'，this）.removeAttr（'disabled'，'disabled'）；//启用按钮
$（'form'）。取消绑定（'submit'）；//启用表单
}
});
}

感谢您的帮助，但其显示控制器错误=>未定义属性：App\Http\Controllers\HomeController:：$output，，如何在控制器中使用输出？我已更新了代码。请你再检查一下好吗？这对我也有帮助。非常感谢。