Question

https://jsfiddle.net/ccfvkjyf/

$(".date-picking").click(function(){
    $('.display').show(); 
});

我想在单击输入框时显示文本，但是单击另一个输入框关闭文本并使用相同的类重新打开文本。

请提出任何想法

Answer 1

您可以尝试以下逻辑：在焦点事件上将焦点输入保存在变量中并在下一个焦点事件中检查它。如果相同的输入再次聚焦，则不要切换，否则切换它

$(document).ready(function(){
var focusedInput;
$(".date-picking").on('focus',function(){
  if(focusedInput!=$(this)){
        focusedInput=$(this); 
    $('.display').hide(1000); 
    $('.display').show(1000); 
  }
});
});

<强> JSFIddle

Answer 2

您可能在hide text字段时尝试blur input，因此您可以使用focus() and blur()方法执行此操作，如下所示

点击输入隐藏文字之外的任何地方。

$(document).ready(function(){
$(".date-picking").on("focus",function(){
	$('.display').show(); 
});
$(".date-picking").on("blur",function(){
	$('.display').hide(); 
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input class="date-picking " name="arrival"  type="text" placeholder="sometext" value=""/>

<input class="date-picking " name="departure"  type="text" placeholder="sometext" value=""/>

<div class="display" style="display:none">Loading text</div>

Answer 3

检查此工作代码段

＆＃13;

   

 $(document).ready(function () {

       function handler1() {
         $('.display').show(); 
        $(this).one("click", handler2);
    }

    function handler2() {
        $('.display').hide(); 
        $(this).one("click", handler1);
    }
    $(".date-picking").one("click", handler1);


    })

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input class="date-picking " name="arrival"  type="text" placeholder="sometext" value=""/>

<input class="date-picking " name="departure"  type="text" placeholder="sometext" value=""/>

<div class="display" style="display:none">Loading text</div>

＆＃13;

jquery show hide使用同一个班级

3 个答案: