我对JS函数有问题。 我在其他名为index.js的文件中编写了函数,但在index.hmtl中,当我使用类似“ onclick = function()”的文件时,该文件无法识别该函数
<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link href="{{asset('css/bootstrap/bootstrap.css')}}" rel="stylesheet">
<link href="{{asset('css/index.css')}}" rel="stylesheet">
<title>Sicurezza del Visitatore</title>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="card card-body" id="cardTitle">
<div class="row">
<div class="col-md-8 offset-md-2 text-center">
<h6>Registrazione dati preliminare all'accesso agli Stabilimenti delle Società:</h6>
</div>
</div>
<br>
<div class="row">
<div class="col-md-8 offset-md-2 text-center">
<h3>BROVEDANI GROUP SpA</h3>
<h3>BROVEDANI SpA</h3>
</div>
</div>
<br>
<div class="row">
<div class="col-md-8 offset-md-2 text-center">
<h6>Scheda Registrazione finalizzata alla Sicurezza del Visitatore</h6>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="card card-body">
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand" href="#">Menu</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="/open">Visite in corso</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/closed">Visite concluse</a>
</li>
</ul>
</div>
</nav>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="card card-body" id="cardContent">
<div class="row">
<div class="col-md-8 offset-md-2 text-center">
<h3>Inserimento nuova visita</h3>
</div>
</div>
<div class="row">
<div class="col-md-6 offset-md-3">
<form>
<br>
<div class="form-group row">
<label class="col-sm-4">Giorno: </label>
<div class="col-sm-8">
<input type="text" class="form-control" id="date" name="date" readonly>
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label" >Addetto:</label>
<select class="col-sm-8 form-control" required id="newAddetto_registrazione" name="newAddetto_registrazione">
@foreach($addetti_reg as $addetto_reg)
<option value="{{$addetto_reg->id}}">{{$addetto_reg->cognome}}</option>
@endforeach
</select>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">Cognome:</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="newCognome" name="newCognome" required autocomplete="off">
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">Nome:</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="newNome" name="newNome" required autocomplete="off">
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">Società:</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="newSocieta" name="newSocieta" autocomplete="off">
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">Accesso al Plant:</label>
<div class="col-sm-8">
@foreach($plants as $plant)
<input type="checkbox" value="{{$plant->nome}}" name="newPlants[]" id="newPlants[]">
<label>{{$plant->nome}} </label>
@endforeach
</div>
</div>
<div class="form-group row">
<label class="col-sm-4 col-form-label">N°Badge:</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="newBadge" name="newBadge" required autocomplete="off">
<p id="errorBadge" style="color: red; font-style: italic; display: none">Badge in uso</p>
</div>
</div>
<div class="row">
<div class="col-md-12 text-center">
<!--HERE--> <button id="btnAggiungi" class="btn btn-dark" onsubmit="return checkBadge()">Aggiungi</button>
</div>
</div>
{{ csrf_field() }}
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="{{asset('js/jquery/jquery-3.3.1.js')}}"></script>
<script src="{{asset('js/bootstrap/bootstrap.js')}}"></script>
<script src="{{asset('js/index.js')}}"></script>
</body>
JS
$().ready(function ()
{
/*
$("#newCognome").keyup(function ()
{
var cognome = $("#newCognome").val();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax
({
type: "post",
url: "/cerca",
data:
{
cognome: cognome
},
success: function (data) {
if(data==null)
{
}
else
{
$("#newNome").val(data.msg.nome);
}
},
error: function () {
alert("chiamata fallita");
}
});
});*/
/*
$("#newBadge").keyup( function ()
{
var badge = $("#newBadge").val();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax
({
type: "post",
url: "/badgevalido",
data:
{
badge: badge
},
success: function (data) {
if(data.msg === "true")
{}
else if(data.msg === "false")
{
alert("Badge in uso");
}
},
error: function () {
alert("chiamata fallita");
}
});
});*/
getDate();
function getDate()
{
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //January is 0!
var yyyy = today.getFullYear();
if(dd<10){
dd='0'+dd;
}
if(mm<10){
mm='0'+mm;
}
var today = dd+'/'+mm+'/'+yyyy;
document.getElementById("date").value = today;
document.getElementById("day").value = today;
}
$("#btnAggiungi").click(function ()
{
checkBadge();
});
function checkBadge()
{
var badge = $("#newBadge").val();
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$.ajax
({
type: "post",
url: "/badgevalido",
data:
{
badge: badge
},
success: function (data) {
if(data.msg === "true")
{}
else if(data.msg === "false")
{
$("#errorBadge").css("display","initial");
}
},
error: function () {
alert("chiamata fallita");
}
});
}
});
我希望HTML中的功能checkBadge()引用JS外部文件,我该怎么做? 我希望HTML中的功能checkBadge()引用JS外部文件,我该怎么做? 我希望HTML中的功能checkBadge()引用JS外部文件,我该怎么做? 我希望HTML中的功能checkBadge()引用JS外部文件,我该怎么做?
我希望HTML中的功能checkBadge()引用JS外部文件,我该怎么做?
答案 0 :(得分:0)
函数声明在当前作用域中创建变量 ,这是您传递给ready()
的匿名函数。
该变量(包含函数)在所述匿名函数之外不可用。
您可以将函数移到外部以使其成为全局函数,然后从您的onclick
属性进行访问,但是:
onclick
属性很糟糕使用jQuery's on
绑定事件处理程序,而不使用onclick
属性。