Question

我在这个部分导航中添加了一个搜索表单：

{!! Form::open(array('id' => 'main_search_form', 'url' => 'main_txt_search', 'class' => 'form-inline pull-xs-right', 'method' => 'get')) !!}
        {!! Form::text('main_search',$value = null, array('placeholder' => 'Search', 'id' => 'main_search_input', 'class' => "form-control")) !!}
        {!! Form::submit('Search', array('class' => 'btn btn-info-outline' )) !!}
        {!! Form::close() !!}

在栏中显示如下：

我想要做的是使用它与一些javascript使用jquery自动完成并在页面中发布搜索结果而不更新它。关键是我在哪里将链接放到表单的脚本中？我试图将它直接放入部分但它们没有被加载。我的app html是这样的：

<!DOCTYPE html>
<html lang="en">
<head>
    <title>My Project</title>

    <!-- CSS contains bootstrap -->
    <link rel="stylesheet" href="/css/app.css">
    <!-- bootstrap mobile first -->
    <meta name="viewport" content="width=device-width, initial-scale=1">

    @yield('scripts')


</head>
<body>


<div class="container">

    @include('partials.nav')

    @yield('content')


</div>


</body>
</html>

所以我在这里想的是，因为页面在包含导航之前加载脚本无法加载脚本...但是因为导航出现在所有页面中......你把这个链接放到脚本中了吗？

Answer 1

页面在包含无法加载脚本的导航
之前加载脚本

有一件事是将脚本加载，即从其src获取并加载到文档中，另一个是引用一个本身尚未存在的html元素解析了。

对于后者，您必须确保脚本位于受影响的html之后。在最后加载它们（将@yield('scripts')移动到底部（</body>之前）或用

包装脚本

$(document).ready(function() {
  //
});

只有在加载文档后才能执行它。

与导航栏中的搜索表单相关的Javascript未显示在源代码中

1 个答案: