Question

我有这个HTML

<input type="text" id="one" />
<input type="text" id="two" />

<button type="button" id="onebtn" >hide</button>

和js为

$('#onebtn').on('click',function(){
    $('#one').fadeOut('slow',function(){
        $('#two').fadeIn('slow');
    });
});

但这似乎不起作用，但如果我使用<input type="button" />它可行，但我想使用<button ></button>

小提琴http://jsfiddle.net/Fzg7b/

Answer 1

这是因为，你没有在你的小提琴中加载jQuery。

从左上角加载jQuery版本。然后它会工作！

http://jsfiddle.net/afzaal_ahmad_zeeshan/Fzg7b/5/

在这里试试吧！它正在发挥作用。

有关C Fairweather提及使用的信息

$(function(){ 
   /* A shortcut for dom ready */
});

如果没有DOM ready函数，我们看到

，没有jQuery代码可以工作

$(document).ready(fucntion () {
   /* functions here.. */
})

但是jsfiddle不需要这个！所以它不是必需的！但要想出一个好点。：）

Answer 2

另外，您正在显示textbox1和textbox2元素。然后说淡出第一个并淡出第二个但第二个文本框已经可见。你不能淡入已经可见的项目。将第二个文本框设置为隐藏。

<input type="text" id="two" style="display: none;" />

完成此操作后，您的代码将按预期运行。此外，在你的jsfiddle中......记得选择你正在使用的jquery版本。目前你什么都没装。

Answer 3

您是否尝试使用.click()？

$('#onebtn').click(function(){
                                 $('#one').fadeOut('slow',function(){
                                 $('#two').fadeIn('slow');
                                    });
                                });

这可能会有所帮助，但我没有时间对此进行测试。

为什么这个onclick jquery不起作用？

3 个答案: