ボタンクリックして削除dom hide要素私にそれを表示させない

Question

私は簡単なことをやっているが、私はなぜそれが次の問題が発生するのかわからない：フォームに値を入力し、要素を '読み込み'すると要素が表示されなくなります。

Javascriptが以下の通りです：

<div> 
    <input id="magLog" name="magLog" type="text" style="width: 500px;"/> 
    <button id="StartITSMcheck">Check</button> 
</div> 
<div> 
    <div id="logContainer" class="filtersUNoBorder" style="padding-left: 8px; height:auto"> 
     <div id="loading" class="clear loading"> 
       Caricamento in corso...</div> 
     <!--Add text after check--> 
    </div> 
</div>  
<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#loading").hide(); 
    }); 
    $("#StartITSMcheck").click(function() { 
     if ($("#magLog").val() != "" && $("#magLog").val() != undefined) { 
      $('#loading').show(); // show the loading message. 
      $.ajax({ 
       type: "GET", 
       url: '<%= Url.Action("StartITSMcheck", "Integration") %>', 
       async: false, 
       data: { "magLog": $("#magLog").val() }, 
       datatype: "html", 
       success: function (result) { 
        $("#logContainer").html(result); 
        $('#loading').hide(); // hide the loading message 
       }, 
       error: function (req, status, error) { 
        if (req.responseText.indexOf('12017') != -1) { 
         alert("CATCH: Status: " + status + " Error " + req.responseText); 
        } 
        else { 
         alert("Error getting data.com -> Req.responseText: " + req.responseText + "Req.status: " + req.status + " status: " + status + " error: " + error); 
        } 
       } 
      }); 
     } else $("#logContainer").html("<p>Gentilmente inserire un magazzino logico</p>"); 
    }); 
</script> 

Answer 1

$("#logContainer").html(result); 

これはおそらく、問題の原因です。 div内のすべてをあなたの応答に置き換えようとしています。これには読み込み要素が含まれています。次のようにdivの外側に配置してみてください。

<div id="logContainer" class="filtersUNoBorder" style="padding-left: 8px; height:auto"> 
    <!--Add text after check--> 
</div> 
<div id="loading" class="clear loading">Caricamento in corso...</div>