답변:
이 작업을 수행하는 올바른 방법은 사용하는 것입니다 show및 hide:
$('#id').hide();
$('#id').show();다른 방법은 jQuery CSS 메소드 를 사용하는 것입니다.
$("#id").css("display", "none");
$("#id").css("display", "block");$(".class").css("display", "none");
$('#id').css('display', 'none');작동하지 않았습니다. 그러나 사용 $('#id').css('color', 'red');이 작동합니다. 그래도 왜 그런지 잘 모르겠습니다. 누구든지 아이디어가 있습니까? 미리 감사드립니다.
이를 위해 여러 가지 방법이 있으며 각각 고유 한 목적으로 사용됩니다.
1. ) 요소에 할 일 목록을 지정하는 동안 인라인 을 사용하려면
$('#ele_id').css('display', 'block').animate(....
$('#ele_id').css('display', 'none').animate(....2. ) 여러 CSS 속성을 설정하는 동안 사용하려면
$('#ele_id').css({
display: 'none'
height: 100px,
width: 100px
});
$('#ele_id').css({
display: 'block'
height: 100px,
width: 100px
});3. ) 명령을 동적으로 호출하려면
$('#ele_id').show();
$('#ele_id').hide();4. ) div 인 경우 블록과 없음을 동적으로 전환하려면
$ ( '# ele_id'). toggle ();
div 표시가 기본적으로 차단되어 있으면 .show()and를 사용 .hide()하거나 더 간단하게 .toggle()가시성을 전환 할 수 있습니다.
숨기기 :
$("#id").css("display", "none");쇼 :
$("#id").css("display", "");간단한 방법 :
function displayChange(){
$(content_id).click(function(){
$(elem_id).toggle();}
)}(function($){
$.fn.displayChange = function(fn){
$this = $(this);
var state = {};
state.old = $this.css('display');
var intervalID = setInterval(function(){
if( $this.css('display') != state.old ){
state.change = $this.css('display');
fn(state);
state.old = $this.css('display');
}
}, 100);
}
$(function(){
var tag = $('#content');
tag.displayChange(function(obj){
console.log(obj);
});
})
})(jQuery);필자의 경우 입력 요소가 비어 있는지 여부에 따라 양식의 요소 표시 / 숨기기를 수행 했으므로 요소를 숨길 때 숨겨진 요소 뒤에 오는 요소가 공간을 차지하도록 재배치되었습니다 .float을 수행해야했습니다. 그런 요소의 요소. dependOn으로 플러그인을 사용하더라도 float을 사용해야했습니다.
이것을 사용하십시오 :
$("#id").(":display").val("block");또는:
$("#id").(":display").val("none");<style> #choosepath { display: none; } </style> <script> $(document).ready(function () { $('#btn_journey').click(function () { alert("button click"); $('#choosepath').css({"display":"normal"}); }); }); </script> </head> <body> <a href="#" class="btn btn-primary btn-lg" id="btn_journey">Start your journey</a> <div class="col-lg-3 col-md-6 mb-4" id="choosepath"> </div> </body></html>
#idID에 사용하고 싶다면 사용하고 싶습니다class.