javascript - Laravel 表单调用 javascript 函数

Question

我不知道在创建页面上提交表单 laravel 时如何在主页上调用 javascript 函数？所有函数都位于js文件中。

在主视图中:

<h1 id="countdown">

在js文件中

function countdown( elementName, minutes, seconds )
{
    var element, endTime, hours, mins, msLeft, time;

    function twoDigits( n )
    {
        return (n <= 9 ? "0" + n : n);
    }

    function updateTimer()
    {
        msLeft = endTime - (+new Date);
        if ( msLeft < 1000 ) {
            element.innerHTML = "kraj";
        } else {
            time = new Date( msLeft );
            hours = time.getUTCHours();
            mins = time.getUTCMinutes();
            element.innerHTML = (hours ? hours + ':' + twoDigits( mins ) : mins) + ':' + twoDigits( time.getUTCSeconds() );
            setTimeout( updateTimer, time.getUTCMilliseconds() + 500 );
        }
    }

    element = document.getElementById( elementName );
    endTime = (+new Date) + 1000 * (60*minutes + seconds) + 500;
    updateTimer();
}

调用函数是 countdown( "countdown", 30, 0 );

创建页面中的表单:

    <form id="formm" class="form-horizontal forma" method="POST" action="porudzbina">
        <input type="hidden" name="_token" value="{{ csrf_token()}}">
    <fieldset>

    <!-- Form Name -->
    <legend class="text2">Porud/bina</legend>

        <div class="form-group">
            <label class="control-label col-sm-2" for="pizza">Pizza</label>
            <div class="controls col-sm-10">
                <select id="pizza_id" name="pizza_id" class="input-xlarge form-control">
                    <option value="1">Capriciossa</option>
                    <option value="2">Margarita</option>
                    <option value="3">Venezia</option>
                </select>
            </div>
        </div>

        <!-- Select Basic -->
        <div class="form-group">
            <label class="control-label col-sm-2" for="velicina">Velicina</label>
            <div class="controls col-sm-10">
                <select id="velicina_id" name="velicina_id" class="input-xlarge form-control">
                    <option value="1">M - 4 €</option>
                    <option value="2">L - 6 €</option>
                    <option value="3">XL - 12 €</option>
                </select>
            </div>
        </div>

        <!-- Select Basic -->
        <div class="form-group">
            <label class="control-label col-sm-2" for="kolicina">Kolicina</label>
            <div class="controls col-sm-10">
                <select id="kolicina" name="kolicina" class="input-xlarge form-control">
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                    <option>4</option>
                    <option>5</option>
                </select>
            </div>
        </div>

        <!-- Textarea -->
        <div class="form-group">
            <label class="control-label col-sm-2" for="napomena">Posebna napomena</label>
            <div class="controls col-sm-10">
                <textarea id="napomena" name="napomena" class="form-control "></textarea>
            </div>
        </div>
</fieldset>



@if($errors->any())
@foreach($errors->all() as $error )
<ul class='alert alert-danger'>
<li>{{$error}}</li>
</ul>

@endforeach
@endif

</form>

Answer 1

您可以像这样使用 jQuery 提交回调。检查documentation .

$("#form").submit(function() {
   countdown("countdown", 30, 0);
});