jQuery移动搜索选项 [英] jquery mobile search option

查看:82
本文介绍了jQuery移动搜索选项的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

<!DOCTYPE html>
<html>
<head>
<title>colls</title>
<link rel="stylesheet" href="./jq/jquery.mobile-1.4.0.css" />
<script src="jquery.js"></script>
<script src="./jq/jquery.mobile-1.4.0.js"></script>
<script src="pay.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

</head>
<body>
<header data-role="header"  data-theme="b">

<h1>liste 1</h1>
</header>
<div  data-role="content" data-theme="b">
<form class="ui-filterable">
<input id="filterBasic-input" data-type="search"  placeholder="votre pays" >
</form>
<div  data-filter="true" data-input="#filterBasic-input"data-theme="b"datainset="true">


<div data-role="collapsible">

<h2><span>alsace</span> <a class="gene02 ui-btn-right"data-role="button"
data-inline="true" data-mini="true" data-icon="search">generique</a></h2>
<p>code:3300</p>
<p class="pays">france</p>

这是我的剧本

$(document).ready(function() {
$(".gene02").click(function() {    
var $hui= $(this).closest('div').find('.pays').html();  
$("#filterBasic-input").val($hui).submit();
});

});

当我单击.gene02时,它将提交结果并进行过滤,但输入值是空白的,并且没有出现清除按钮.请帮忙.

when i click on .gene02 it submit the result and filter it but the value of the imput is blank and the clear button didn't appear. any help please.

当我从脚本中删除.submit时,值更改但未过滤. 寻求帮助

when i remove .submit from my script the value change but it is not filtered. thx for help

推荐答案

首先,请勿在jQuery Mobile中使用.ready(),而应使用pagecreate.

First of all, dont use .ready() in jQuery Mobile, use pagecreate instead.

第二,您需要在包含可过滤数据的div上手动触发可过滤.

Secondly, you need to trigger filterable manually on the div which contains filterable data.

HTML

<div id="filter" data-filter="true" data-input="#filterBasic-input" data-theme="b" datainset="true" >

JS

$(document).on("pagecreate", function () {
  $(".gene02").on("click", function () {
    var $hui = $(this).closest('div').find('.pays').html();
    $("#filterBasic-input").val($hui);
    $("#filter").filterable("refresh"); /* this */
  });
});

演示

Demo

这篇关于jQuery移动搜索选项的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆