当textarea使用jQuery进行焦点时，隐藏div会出现吗？

这里是我的小提琴：http://jsfiddle.net/neowot/mmtk7wzp/当textarea使用jQuery进行焦点时，隐藏div会出现吗？

出于某种原因，该代码强制第二textarea的具有自动对焦，这是我做不希望。

我想让用户不得不点击它才能获得焦点。当他们点击时，应该出现HiddenDiv。

任何帮助表示赞赏。

<textarea></textarea><br><br> 

<textarea id = "TextArea"></textarea><br><br> 

<div id="HiddenBox"></div>

#HiddenBox { 
    background:red; 
    width:50px; 
    height:50px; 
    display:none; 
} 

#TextArea { 
}

if ($('#TextArea').focus()) { 
    $('#HiddenBox').fadeIn(0); 
}

来源

2015-05-09 Neo

的问题是因为你的代码负载运行，并违背了focus()方法的if语句。这个逻辑是不正确的，因为这会触发焦点事件并返回一个jQuery对象，这意味着它总是等于true。

运行一些代码，当focus事件实际上火灾，你应该挂钩到事件是这样的：

$('#TextArea').focus(function() { 
    $('#HiddenBox').fadeIn(0); 
});

Updated fiddle

注意，您可以使用show()，hide()或toggle()代替fadeIn(0)，取决于你想要的确切行为。

来源

2015-05-09 23:53:47

你可以用纯CSS与你当前的标记做到这一点。

#HiddenBox { 
 
    display: none; 
 
} 
 
#TextArea:focus ~ #HiddenBox { 
 
    display: block; 
 
}

<textarea id="TextArea"></textarea> 
 

 
<br><br> 
 

 
<div id="HiddenBox">*</div>

来源

2015-05-09 23:57:10 Stickers

好吧，有一个事情。你需要一个处理进出事件的处理程序。

我写了这个，并在你的jsFiddle中试过了。替换它在JavaScript框中，它应该工作。

$("#TextArea").on("focusin", function(){ 
    $("#HiddenBox").fadeIn(); 
}); 

$("#TextArea").on("focusout", function(){ 
    $("#HiddenBox").fadeOut(); 
})

我不确定这是我们寻找的，但我希望它能正常工作。

问候。

来源

2015-05-10 00:03:31 edd2110

当textarea使用jQuery进行焦点时，隐藏div会出现吗？

回答

相关问题