Question

我在我的代码中使用Framework7 1.7.0版本。我需要在搜索栏中添加智能选择，以便在我的表单中选择国家/地区。

https://v1.framework7.io/docs/smart-select.html#smart-select-with-search-bar

我的表单代码以弹出窗口打开：

<div class="loginform">
<form id="RegisterForm" method="post">
<input type="text" name="fname" value="" class="form_input required" placeholder="First Name" />
<input type="text" name="lname" value="" class="form_input required" placeholder="Last Name" />
<select id="gender" name="gender" class="form_input required" />
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
<input type="email" name="email" id="email" value="" class="form_input required" placeholder="Email" />
<select id="country" name="country" class="form_input required"></select>

<!--To be added smart select with search bar instead of above-->

<input type="submit" name="submit" class="form_submit" id="submit" value="REGISTER" />
</form>
</div>

如果我在index.html中添加以下代码来测试智能选择不将它与任何其他代码混合，它会显示一个空白页面：

<div class="popup popup-signup">
<div class="content-block-login">
<h4>TESTING</h4>
<div class="form_logo"><h4>TEST</h4></div>
<div class="view view-main">
<div class="navbar"></div>
<div class="pages navbar-through">
<div data-page="home" class="page">
<div class="list-block">

<div class="loginform">
<form id="RegisterForm" method="post">
<ul>
<li><a href="#" data-searchbar="true" data-searchbar-placeholder="Search Country" class="item-link smart-select">
<select name="fruits">
<option value="apple" selected>Apple</option>
<option value="pineapple">Pineapple</option>
<option value="pear">Pear</option>
<option value="orange">Orange</option>
<option value="melon">Melon</option>
<option value="peach">Peach</option>
<option value="banana">Banana</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Country</div>
</div>
</div></a></li>
</ul>
</form>
</div>
</div>
</div>
</div>
</div>

不知道，为什么它没有在Framework7 index.html页面上工作？请求专家帮助。

Answer 1

工作正常。在查看main之前，您必须删除其他代码。

<div class="popup popup-signup">
<div class="content-block-login">
<h4>TESTING</h4>
<div class="form_logo"><h4>TEST</h4></div>

我已经更改了测试页面尝试一次的代码

<div class="view view-main">
<div class="navbar"></div>
<div class="pages navbar-through">
<div data-page="home" class="page" style="margin-top:35px;">
<div class="list-block">

<div class="loginform">
<form id="RegisterForm" method="post">
<ul>
<li><a href="#" data-searchbar="true" data-searchbar-placeholder="Search Country" class="item-link smart-select" data-back-on-select="true">
<select name="fruits">
<option value="apple" selected>Apple</option>
<option value="pineapple">Pineapple</option>
<option value="pear">Pear</option>
<option value="orange">Orange</option>
<option value="melon">Melon</option>
<option value="peach">Peach</option>
<option value="banana">Banana</option>
</select>
<div class="item-content">
<div class="item-inner">
<div class="item-title">Country</div>
</div>
</div></a></li>
</ul>
</form>
</div>
</div>
</div>
</div>
</div>

Framework7 V1和Smart Select问题

1 个答案: