ボタンを2回クリックして実行する機能があります

Question

Add Commentボタンをクリックするとポップアップが表示されなくなりましたが、2回クリックするだけで機能します。最初にクリックすると、2つのボタンが消えて再び表示されます。その後、それをクリックすると、2回目に消えて機能が正常に動作します。

最初のクリックでポップアップが消えると、戻るボタンが完全に機能します。私はそれが私のコメント機能の中でそれをしようとすることと関係があると仮定しているが、私はそれを把握することはできません。

HTMLコード：

<div data-role="popup" id="popupComment" data-theme="a" class="ui-corner-all"> 
    <form> 
     <div style="padding:10px 20px;"> 
      <h3>Please add comment</h3> 
      <label for="un" class="ui-hidden-accessible">Comment:</label> 
      <input type="text" name="comment" id="comment" value="" placeholder="Comment" data-theme="a"> 
      <button onclick="goCommenting()" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-btn-icon-left ui-icon-check">Add Comment</button> 
      <button onclick="document.getElementById('popupComment').style.display='none'; event.preventDefault();" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-btn-icon-left ui-icon-check">Back</button> 
     </div> 
    </form> 
</div> 

のJavaScriptコード：

function goCommenting(){ 

    //alert(document.getElementById("comment").value); 
    var infoWindow = new google.maps.InfoWindow(); 
    var listener1 = map.addListener('click', function(e) { 

       //var comment = document.getElementById("editNameBox").value; 
       placeMarkerAndPanTo(e.latLng, map,comment); 
      }); 


    function placeMarkerAndPanTo(latLng, map) { 
     var commentMarker = new google.maps.Marker({ 
      position: latLng, 
      map: map, 
      draggable:true 
     }); 
     (function (commentMarker) { 
      google.maps.event.addListener(commentMarker, "click", function (e) { 
       //Wrap the content inside an HTML DIV in order to set height and width of InfoWindow. 
       infoWindow.setContent("<div>'"+document.getElementById("comment").value+"'</div>"); 
       infoWindow.open(map, commentMarker); 
      }); 
     })(commentMarker); 

     //(function (commentMarker) { 
      google.maps.event.addListener(
       commentMarker, 
       'drag', 
       function() { 
        //document.getElementById('lat').value = marker.position.lat(); 
        //document.getElementById('lng').value = marker.position.lng(); 
       } 
       ); 
     //})(commentMarker); 

     google.maps.event.removeListener(listener1); 
    } 
    event.preventDefault(); 
    document.getElementById('popupComment').style.display='none'; 
} 

Answer 1

フォームがイベントを提出しないように配慮してください。

<form onSubmit="return false">