javascript - jQuery Mobile 文本/搜索更改事件的行为不同

Question

我有一个 jQuery 移动应用程序，其中更改事件绑定(bind)到某些文本输入。特别是带有 type="search"的文本输入不会像 type"text"文本输入那样触发 "change"事件。这是一个片段来解释:

HTML

<div data-role="page" id="p1"> 
    <div  data-role="content">
        <a href="#p2" data-role="button">Go To Page 2</a>
    </div>
</div> 

<div data-role="page" id="p2">
    <div  data-role="content">
        <p>This is page2</p>
        <input type="text" id='mytextbox'></input>
        <input type="search" id='mysearchbox'></input>
    </div>
</div> 

JavaScript

$('#mytextbox').change(function() {
    alert('Hello World!');
});
$('#mysearchbox').change(function() {
    alert('Hello World!');
});

两个文本输入除了它们的 id 和它们的类型之外是相同的。文本框在发生更改事件时触发，搜索框则不会。

我发现，如果文本输入位于第 1 页，一切都会如您所愿。所以这是页面变化和文本字段类型之间的关系。

这是一个 fiddle :http://jsfiddle.net/nMR85/1644/

Answer 1

替换这个

<div data-role="page" id="p2">
    <div  data-role="content">
        <p>This is page2</p>
        <input type="text" id='mytextbox'></input>
        <input type="search" id='mysearchbox'></input>
    </div>
</div> 

有了这个

<div data-role="page" id="p2">
    <div  data-role="content">
        <p>This is page2</p>
        <input data-type="text" id='mytextbox'></input>
        <input data-type="search" id='mysearchbox'></input>
    </div>
</div> 

区别在于我需要指定“数据类型”而不是“类型”。