bootstrap javascript wie ein div in einem modalen Fenster zu verstecken

Question

Ich habe ein Bootstrap modales Fenster und ich möchte ein div-Element mit Javascript verstecken.

Das Bootstrap-Fenster ist

<div class="modal hide editdialog" id="edit-dialog" data-backdrop="static" style="margin-top: -370px"> 
    <div class="modal-header"> 
     <div style="float: right; margin-right: 2px"> 
      <a id="maximizebuttoneditor" href="#" onclick="maximizeEditor()" rel="tooltip" title="<spring:message code="label.Maximize" />"><i class="icon icon-fullscreen"></i></a> 
      <a id="restoredownbuttoneditor" style="display: none" href="#" onclick="restoreDownEditor()" rel="tooltip" title="<spring:message code="label.RestoreDown" />"><i class="icon icon-resize-small"></i></a> 
     </div> 
     <span id="edit-dialog-title"><spring:message code="label.Edit" /></span> 
     </div> 
     <div class="modal-body" style="max-height: 610px; height: 610px;">  

     <ul class="nav nav-tabs" id="edit-dialog-tabs"> 
      <li><a href="#general" data-toggle="tab"><spring:message code="label.General" /></a></li> 
      <li id="question-dialog-advanced-tab"><a href="#advanced" data-toggle="tab"><spring:message code="label.Advanced" /></a></li> 
      <li><a href="#dependencies" data-toggle="tab"><spring:message code="label.Dependencies" /></a></li> 
     </ul>    
     <div class="tab-content"> 
      <div class="tab-pane active" id="general" > 

       <div style="margin-top: 20px;" class="general-regex-dialog-questions" id="general-regex-dialog-questions"> 
        <span class="overview-label"><spring:message code="label.RegEx" /></span><br /> 
        <input id="question-dialog-regex" type="text" maxlength="255" /> 
        <span id="question-dialog-regex-invalid" class="validation-error hide"><spring:message code="validation.NoRegExPattern" /></span> 
       </div>    

      </div> 
      <div class="tab-pane" id="advanced"> 

      </div> 
      <div class="tab-pane" id="dependencies">  

      </div>   
     </div>    
     </div> 
      <div class="modal-footer"> 
      <a id="btnEditOk" onclick="updateSurvey();" class="btn btn-info"><spring:message code="label.OK" /></a> 
      <a id="btnEditCancel" class="btn" onclick="selectedElement = null;$('#edit-dialog').modal('hide');"><spring:message code="label.Cancel" /></a> 
      </div> 
</div> 

ich die div general-regex-dialog-questions

Ich verwende den folgenden JavaScript-Code

$("#general-regex-dialog-questions").css({"display": "none !important"}); 

Das div-Element ausblenden möchten nicht verborgen ist.

Ich verstehe nicht warum.

Answer 1

Diese Syntax {"display": "none! Wichtig"} funktioniert nicht wegen der! Wichtig.
Wenn Sie die! Wichtig weglassen, funktioniert es gut.
Wenn Sie jedoch die Bedeutung als auch festlegen möchten, können Sie es wie folgt festgelegt:

$('.foo').each(function() { 
    this.style.setProperty('display', 'none', 'important'); 
}); 

Answer 2

ein Element mit Jquery zu verstecken, sollten Sie die .hide() Methode verwenden. Wenn Sie es zurück zeigen möchten, verwenden Sie .show().

Wenn Sie zwischen den beiden wechseln könnten Sie auch .toggle() verwenden, die den Zustand wechseln (versteckt/sichtbar).

Wenn es immer noch nicht funktioniert, versuchen, etwas Druck, wenn Ihr Event-Funktion aufrufen, dass Ihr .Hide machen() aufgerufen wird oder aus dem Ergebnis der Auswahl drucken $("#...")

$("#test").click(function(e){ 
 
    $("#test").hide(); 
 
}); 
 

 
function show() { 
 
    $("#test").show() 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<h1> Title </h1> 
 
<button onclick="show()">Show it back</button> 
 
<div id="test" style="background-color: #CCC"> 
 
    <h2>Bunch of stuff</h2> 
 
    <p>Blabla blabla blabla <br> 
 
    Click on me to make me disappear </p> 
 
    <span> I'm a span and I dissapear too </span> 
 
</div> 
 

 
<p> Bunch of stuff that will not disappear neither </p>

Answer 3

Vielleicht, weil es im Modal ist.

Sie können es so versuchen:

$(window).ready(function(){ 

    $("#edit-dialog").find("#general-regex-dialog-questions").hide(); 
    //or 
    $("#edit-dialog").find("#general-regex-dialog-questions").css({"display": "none"}); 
}); 

Hoffe, es hilft.