Javascript Girl
  1. Javascript Girl
  3. J'ai créé une boîte de dialogue, maintenant Comment puis-je la fermer?
Intereting Posts
Autoriser les événements de pointeur (clic) à passer à travers l'élément tout en maintenant l'option de défilement Comment convertir des caractères indicateurs en caractères échoués Unicode Comment puis-je obtenir le mois et la date de JavaScript en format 2 chiffres? Reliure ponctuelle unie par angulaire pour les expressions Vérifiez si le nom de la propriété est l'index du tableau Ajout de plusieurs éléments VML via JavaScript dans IE8 Code Javascript pour forcer la page html à ouvrir dans le navigateur Chrome? Javascript: échapper à des guillemets doubles en HTML Possibilité d'empêcher d'entrer en soumettant un formulaire en Javascript à partir de certains champs d'entrée uniquement AngularJS ngMessages ne peut pas se lier à $ index expression Invertir la couleur de l'image Onmouseover Obtenir une erreur tout en détectant l'extension chrome installée ou ne pas utiliser javascript JS mouseenter déclenché deux fois Comment créer une liste de défilement automatique Plus récemment, un Google Map après le conteneur a changé la largeur

J'ai créé une boîte de dialogue, maintenant Comment puis-je la fermer?

J'ai inclus un lien vers mon site ci-dessous pour l'examen du JS dans la section principale, ainsi que pour vous permettre de voir comment je l'ai réglé. Si vous ne souhaitez pas utiliser le lien, j'essaierai également d'inclure le code ci-dessous.

J'ai récemment appris quelques AJAX de base et sur des pages sélectionnées de mon site http://classifieds.your-adrenaline-fix.com/detail.php?fatherID=37&TypeID=42&ListingID=42 J'ai créé une boîte de dialogue que vous verrez apparaître sous forme d'image .

Si quelqu'un pourrait partager avec moi comment je peux faire fermer le bouton Fermer fermer la boîte de dialogue, je serais très reconnaissant.

Voici le JS 

<script type="text/javascript"> function loaddiv(thediv, thefile) { if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject ('Microsoft.XMLHTTP'); } xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById(thediv).innerHTML = xmlhttp.responseText; } } xmlhttp.open('GET', thefile, true); xmlhttp.send(); } </script>

Ensuite, sur la page, j'ai seulement 

 echo "<div id='div2'></div>";

Ensuite, pour la boîte qui apparaît: 

 <div class="DoYouHaveADirtBikeForSaleBox"> <h2>Got A Dirt Bike You Want to Sell?</h2> <p class="DirtBikeForSaleBannerButton"> <a href="http://classifieds.your-adrenaline-fix.com/add.php">Yea, Show Me How</a> </p> <p class="DirtBikeForSaleBannerButtonNoThanks"> <a href="CloseDialog">Nope, Get This Out of The Way</a> </p> </div>

Si quelqu'un pouvait partager avec moi comment je peux faire disparaître cette boîte de dialogue en cliquant sur le bouton Fermer, je serais très reconnaissant et j'aimerais vous remercier tous à l'avance.

Merci,

Stuart K

Ou vous pouvez essayer ceci: 

 <div class="DoYouHaveADirtBikeForSaleBox" id="DoYouHaveADirtBikeForSaleBox"> <h2>Got A Dirt Bike You Want to Sell?</h2> <p class="DirtBikeForSaleBannerButton"> <a href="http://classifieds.your-adrenaline-fix.com/add.php">Yea, Show Me How</a> </p> <p class="DirtBikeForSaleBannerButtonNoThanks"> <a onclick="javascript:document.getElementById('DoYouHaveADirtBikeForSaleBox').style.visibility='hidden';">Nope, Get This Out of The Way</a> </p> </div>

Testé sur mon hôte local xD

__ _ __ _ __ _ __ EDITÉE _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _

Mieux vaut essayer ceci et voir si le défilement ne montre pas le div à nouveau: 

 <div class="DoYouHaveADirtBikeForSaleBox" id="DoYouHaveADirtBikeForSaleBox"> <h2>Got A Dirt Bike You Want to Sell?</h2> <p class="DirtBikeForSaleBannerButton"> <a href="http://classifieds.your-adrenaline-fix.com/add.php">Yea, Show Me How</a> </p> <p class="DirtBikeForSaleBannerButtonNoThanks"> <a onclick="javascript:var div = document.getElementById('DoYouHaveADirtBikeForSaleBox');div.parentNode.removeChild(div);">Nope, Get This Out of The Way</a>

—————————- UPDATE2 ——————— ———— 

  <div id='div2'> <div class="DoYouHaveADirtBikeForSaleBox" id="DoYouHaveADirtBikeForSaleBox"> <h2>Got A Dirt Bike You Want to Sell?</h2> <p class="DirtBikeForSaleBannerButton"> <a href="http://classifieds.your-adrenaline-fix.com/add.php">Yea, Show Me How</a> </p> <p class="DirtBikeForSaleBannerButtonNoThanks"> <a onclick="javascript:var div = document.getElementById('div2');div.parentNode.removeChild(div);">Nope, Get This Out of The Way</a> </p> </div> </div>

Saludos;)

Vous pouvez le supprimer de la dom en utilisant 

 element.parentNode.removeChild(element);

Ou vous pouvez définir le style d'affichage de l'élément sur 'aucun', puis vous pouvez jouer avec lui et créer open-close

Si vous utilisez jquery, vous pouvez le faire avec la méthode "live". Cela attache les gestionnaires d'événements à tous les nouveaux éléments qui apparaissent sur la page, même après une requête ajax. Donc, si vous avez donné un coup de pouce à une classe: 

 <a href="#" class="close_dialog">Nope, Get this out of the way</a>

Vous pouvez utiliser ce bit si jquery:

$('.close_dialog').live('click', function(){ $('.DoYouHaveADirtBikeForSaleBox').remove(); });

J'espère que cela pourra aider 🙂

Vous pouvez faire un bouton à l'intérieur de div2 et ajouter un attribut onClick comme ceci: 

 <button onclick="document.getElementById('div2').style.display='none'">Close</button>

Si vous ne voulez pas le montrer à nouveau, vous pouvez appeler

document.getElementById('div2').remove();

Dans la méthode onclick du bouton de fermeture.

Ou si vous pourriez l'utiliser à nouveau, appelez

document.getElementById('div2').style.display = 'none';

Pour appeler la fonction de fermeture à partir de l'attribut href:

<a href="javascript: CloseDialog();">Nope, Get This Out of The Way</a>