Fermer lors du clique [Résolu/Fermé]

Signaler
-
 enora -
Bonjour,

j'ai
onclick="insertTag(' :couleurbleu: ', '', 'textarea');">

afin d’inséré une couleur bleu dans le texterea

j'aimerais lors du onclick lors du choix de la couleur

la fenêtre se ferme

j'ai tester de mettre a chaque insertion couleur un window.close pour fermer la fenetre lors du clique

ca n se ferme pas

merci de votre aide

3 réponses

Messages postés
2295
Date d'inscription
mercredi 25 février 2009
Statut
Membre
Dernière intervention
22 juillet 2019
182
c'est une fenetre mondal

j'ai tester ca

avant j'ai ce code dans ma fenetre mondal

<span class="icon-smileyhappy1 codesmileys" title="Smiley Happy" onclick="insertTag(' :SmileyHappy1: ', '', 'textarea');"></span>



le textarea

<textarea class="textareaformulaire" onkeyup="preview(this, 'previewDiv');" onselect="preview(this, 'previewDiv');" id="textarea"></textarea>


quand je clique sur le smileys je vois bien la balise SmileyHappy1 dans le texterea
là il n a pas de souci


par contre il ne ferme pas la fenêtre


j'ai tester de remplacer les codes par


<span class="icon-smileyhappy1 codesmileys" title="Smiley Happy" data-onclick = " :SmileyHappy1: ||textarea" ></span


<textarea class="textareaformulaire" onkeyup="preview(this, 'previewDiv');" onselect="preview(this, 'previewDiv');" id="textarea"></textarea>


dans le code js j'ai rajouté



//$('.codesmileys').bind('click', function() {
var dataOnClick = $(this).data('onclick').split("|");
 
//faire quelque chose
});

$('.textareaformulaire').keyup(function(){
 console.log($(this).data('onkeyup'));
}


mais ca ne fonctionne pas lors du clique sur smilys et ca ferme pas la fenêtre après avoir clique sur le smileys

Configuration: Windows / Chrome 50.0.2661.102
je vais te mettre tout

le boutton smileys

<button type="button" class="buttons poplight" data-idmodal="smileys" title="smileys"><span class="icon-formulairesmileys" title="formulaire smileys"></span></button>


quand j'appuie ca me fait ouvrir la fenetre mondal

      <div id="smileys" class="popup_block">
	                                        <h2 class="titrefenetrepoup">Ajouter un Smiley fixe</h2>
											<div class="mondalhaut">
											                       <!-- <span class="icon-smileyhappy1 codesmileys" title="Smiley Happy" data-onclick = " :SmileyHappy1: ||textarea" >-->
																	

																	
																	
																	
																	
																	<span class="icon-smileyhappy1 codesmileys" title="Smiley Happy" onclick="insertTag(' :SmileyHappy1: ', '', 'textarea');">
</div>


pour l'instant pas de soucy


quand je clique sur ce smileys

je vois SmileyHappy1 dans le texterea

grace a bbcode.js

      function insertTag(startTag, endTag, textareaId, tagType)
	  {
	         var field = document.getElementById(textareaId);
			 var scroll = field.scrollTop;
			 field.focus();
			 
			 if (window.ActiveXObject)
			 {
			 var textRange = document.selection.createRange();
			 var currentSelection = textRange.text;
			 }
			 else
			 {
			 var startSelection   = field.value.substring(0, field.selectionStart);
			 var currentSelection = field.value.substring(field.selectionStart, field.selectionEnd);
			 var endSelection     = field.value.substring(field.selectionEnd);
			 }
			 
			 if (tagType)
			 {
			 switch (tagType)
			 {
			            case "lien":
						endTag = "</lien>";
						if (currentSelection)
						{
						        if (currentSelection.indexOf("http://") == 0 || currentSelection.indexOf("https://") == 0 || currentSelection.indexOf("ftp://") == 0 || currentSelection.indexOf("www.") == 0)
								{
								var label = prompt("Quel est le libellé du lien ?") || "";
								startTag = "<lien url=\"" + currentSelection + "\">";
								currentSelection = label;
								}
								else
								{
								var URL = prompt("Quelle est l'url ?");
								startTag = "<lien url=\"" + URL + "\">";
								}
						}
						else
						{
					    var URL = prompt("Quelle est l'url ?") || "";
						var label = prompt("Quel est le libellé du lien ?") || "";
						startTag = "<lien url=\"" + URL + "\">";
						currentSelection = label;
						}
			
			 break;
			 
			 case "citation":
			 
			                      endTag = "</citation>";
								  if (currentSelection)
								  {
								  if (currentSelection.length > 30)
								  {
								  var auteur = prompt("Quel est l'auteur de la citation ?") || "";
								  startTag = "<citation nom=\"" + auteur + "\">";
								  }
								  else
								  {
								  var citation = prompt("Quelle est la citation ?") || "";
								  startTag = "<citation nom=\"" + currentSelection + "\">";
								  currentSelection = citation;
								  }
								  }
								  else
								  {
								  var auteur = prompt("Quel est l'auteur de la citation ?") || "";
								  var citation = prompt("Quelle est la citation ?") || "";
								  startTag = "<citation nom=\"" + auteur + "\">";
								  currentSelection = citation;    
								  }
			 break;
			 }
			 }
			 
			 if (window.ActiveXObject)
			 {
			 textRange.text = startTag + currentSelection + endTag;
			 textRange.moveStart('character', -endTag.length-currentSelection.length);
			 textRange.moveEnd('character', -endTag.length);
			 textRange.select();
			 }
			 else
			 { // Ce n'est pas IE
			 field.value = startSelection + startTag + currentSelection + endTag + endSelection;
			 field.focus();
			 field.setSelectionRange(startSelection.length + startTag.length, startSelection.length + startTag.length + currentSelection.length);
			 }  
			 
			 field.scrollTop = scroll;
			 
			 }
			 
			 
			 
			 function preview(textareaId, previewDiv)
			 {
			 var field = textareaId.value;
			 if (document.getElementById('previsualisation').checked && field)
			 {
			 var smiliesName = new Array(':magicien:', ':colere:', ':diable:', ':ange:', ':ninja:', '>_<', ':pirate:', ':zorro:', ':honte:', ':soleil:', ':\'\\(', ':waw:', ':\\)', ':D', ';\\)', ':p', ':lol:', ':euh:', ':\\(', ':o', ':colere2:', 'o_O', '\\^\\^', ':\\-°');
			 var smiliesUrl  = new Array('magicien.png', 'angry.gif', 'diable.png', 'ange.png', 'ninja.png', 'pinch.png', 'pirate.png', 'zorro.png', 'rouge.png', 'soleil.png', 'pleure.png', 'waw.png', 'smile.png', 'heureux.png', 'clin.png', 'langue.png', 'rire.gif', 'unsure.gif', 'triste.png', 'huh.png', 'mechant.png', 'blink.gif', 'hihi.png', 'siffle.png');
			 var smiliesPath = "http://www.siteduzero.com/Templates/images/smilies/";
			 
			 field = field.replace(/&/g, '&');
			 field = field.replace(/</g, '<').replace(/>/g, '>');
			 field = field.replace(/\n/g, '<br />').replace(/\t/g, '        ');
			 field = field.replace(/<gras>([\s\S]*?)<\/gras>/g, '<strong>$1</strong>');
			 field = field.replace(/<italique>([\s\S]*?)<\/italique>/g, '<em>$1</em>');
			 field = field.replace(/<lien>([\s\S]*?)<\/lien>/g, '<a href="$1">$1</a>');
			 field = field.replace(/<lien url="([\s\S]*?)">([\s\S]*?)<\/lien>/g, '<a href="$1" title="$2">$2</a>');
			 field = field.replace(/<image>([\s\S]*?)<\/image>/g, '<img src="$1" alt="Image" />');
			 field = field.replace(/<citation nom=\"(.*?)\">([\s\S]*?)<\/citation>/g, '<br /><span class="citation">Citation : $1</span><div class="citation2">$2</div>');
			 field = field.replace(/<citation lien=\"(.*?)\">([\s\S]*?)<\/citation>/g, '<br /><span class="citation"><a href="$1">Citation</a></span><div class="citation2">$2</div>');
			 field = field.replace(/<citation nom=\"(.*?)\" lien=\"(.*?)\">([\s\S]*?)<\/citation>/g, '<br /><span class="citation"><a href="$2">Citation : $1</a></span><div class="citation2">$3</div>');
			 field = field.replace(/<citation lien=\"(.*?)\" nom=\"(.*?)\">([\s\S]*?)<\/citation>/g, '<br /><span class="citation"><a href="$1">Citation : $2</a></span><div class="citation2">$3</div>');
			 field = field.replace(/<citation>([\s\S]*?)<\/citation>/g, '<br /><span class="citation">Citation</span><div class="citation2">$1</div>');
			 field = field.replace(/<taille valeur=\"(.*?)\">([\s\S]*?)<\/taille>/g, '<span class="$1">$2</span>');
			 
			 for (var i=0, c=smiliesName.length; i<c; i++)
			 {
			 field = field.replace(new RegExp(" " + smiliesName[i] + " ", "g"), " <img src=\"" + smiliesPath + smiliesUrl[i] + "\" alt=\"" + smiliesUrl[i] + "\" /> ");
			 }
			 document.getElementById(previewDiv).innerHTML = field;
			 }
			 }
			 
			 function getXMLHttpRequest()
			 {
			 var xhr = null;
			 if (window.XMLHttpRequest || window.ActiveXObject)
			 {
			 if (window.ActiveXObject)
			 {
			 try
			 {
			 xhr = new ActiveXObject("Msxml2.XMLHTTP");
			 }
			 catch(e)
			 {
			 xhr = new ActiveXObject("Microsoft.XMLHTTP");
			 }
			 }
			 else
			 {
			 xhr = new XMLHttpRequest();
			 }
			 }
			 else
			 {
			 alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
			 return null;
			 }
			 return xhr;
			 }
			 
			 function view(textareaId, viewDiv)
			 {
			 var content = encodeURIComponent(document.getElementById(textareaId).value);
			 var xhr = getXMLHttpRequest();
			 
			 if (xhr && xhr.readyState != 0)
			 {
			 xhr.abort();
			 delete xhr;
			 }
			 
			 xhr.onreadystatechange = function()
			 {
			 if (xhr.readyState == 4 && xhr.status == 200)
			 {
			 document.getElementById(viewDiv).innerHTML = xhr.responseText;
			 }
			 else
			 if (xhr.readyState == 3)
			 {
			 document.getElementById(viewDiv).innerHTML = "<div style=\"text-align: center;\">Chargement en cours...</div>";
			 }
			 }
			 
			 xhr.open("POST", "../php/preview.php", true);
			 xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
			 xhr.send("string=" + content);





$('#fade , .popup_block').fadeOut(function() {
		$('#fade, span.close').remove();  //...ils disparaissent ensemble
	});






      }


là j'ai mis le code pour fermer la fenetre lors du clik du smileys

je te met le code mondal.js

$('.poplight').click(function() {
	//------------------------------------//
  //Variables à définir
  //------------------------------------//
var popID = $(this).data('idmodal'); //retourne la valeur de l'attribut data-idmodal de l'élément cliqué
console.log("ID de la popop = "+popID); // j'ai changer ID de la popop par le nom
console.log("test"+popID); // j'ai changer ID de la popop par le nom
var popWidth = "400"; // Largeur de la modal à définir

  
  //------------------------------------//
  // Affichage de la modale
  //------------------------------------//
	//Faire apparaitre la pop-up et ajouter le bouton de fermeture
	$('#' + popID).fadeIn().css({
		'width': Number(popWidth)
	})
	.prepend('<span class="icon-fermermondal close" onClick="" title="Fermer">');

	//Récupération du margin, qui permettra de centrer la fenêtre - on ajuste de 80px en conformité avec le CSS
	var popMargTop = ($('#' + popID).height() + 80) / 2;
	var popMargLeft = ($('#' + popID).width() + 80) / 2;

	//On affecte le margin
	$('#' + popID).css({
		'margin-top' : -popMargTop,
		'margin-left' : -popMargLeft
	});

	//Effet fade-in du fond opaque
	$('body').append('<div id="fade"></div>'); //Ajout du fond opaque noir
	//Apparition du fond - .css({'filter' : 'alpha(opacity=80)'}) pour corriger les bogues de IE
	$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();

	return false;
});

$('#fade , .popup_block').fadeOut(function() {
		$('#fade, span.close').remove();  //...ils disparaissent ensemble
	});


//$('.codesmileys').bind('click', function() {
//var dataOnClick = $(this).data('onclick').split("|");
 
//faire quelque chose
//});

//$('.textareaformulaire').keyup(function(){
// console.log($(this).data('onkeyup'));
//}


j'ai mis consol teste

il ne met pas d'erreur ni message

merci
Messages postés
31196
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
25 janvier 2021
3 211 > enora
Il t'affiche quoi exactement dans la console ??
Tu peux me faire un screen ?
voilà la capture

http://hpics.li/56c1709

dans google chrome

dans la console

mondal.js:6 ID de la popop = smileys
mondal.js:7 testsmileys


ca correspond

console.log("ID de la popop = "+popID); // j'ai changer ID de la popop par le nom
console.log("test"+popID); // j'ai changer ID de la popop par le nom


il y a que ces erreurs là que je vois
Messages postés
31196
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
25 janvier 2021
3 211
Et les console.log("test") qiue je t'avais demandé de mettre ?
il m'affiche ca sur la console
en mettant

console.log("ID de la popop = "+popID); // j'ai changer ID de la popop par le nom
console.log("test"+popID); // j'ai changer ID de la popop par le nom
console.log("test");




mondal.js:6 ID de la popop = smileys
mondal.js:7 testsmileys
mondal.js:8 test

j'ai réinstaller firbuf fire fox

il me met


2
"NetworkError: 404 Not Found - http://site.legtux.org/V1/includes/js/prew.js"
prew.js
TypeError: node is null
 

var child_nodes_temp = node.childNodes;

 
container.js (ligne 134, col. 13)
ID de la popop = smileys
mondal.js (ligne 6)
testsmileys
mondal.js (ligne 7)
test
mondal.js (ligne 8)
TypeError: document.getElementById(...) is null
 

if (document.getElementById('previsualisation').checked && field)

 
bbcode.js (ligne 100, col. 9)


j'ai que ca come ereur
eut etre que j'ai trouver je te tien au courrant si ca marche ou sil y a un bug

pour le moment ca marche
bonjours, c'est bon j'ai rouvé et ca fonctionne lors du clique ca ferme la fenetre

en tout ca je t'en remerci
juste un petit truc qui me chagrine ;)

si je met

 <span class="icon-formulairesmileys " onclick="insertTag(' :SmileyHappy1: ', '', 'textarea');" title="formulaire smileys"></span>


là il met la balise SmileyHappy1 dans le texterea mais il oublie de fermer la fenetre mondale

si je met en rajoute

<span class="icon-formulairesmileys close" onclick="insertTag(' :SmileyHappy1: ', '', 'textarea');" title="formulaire smileys"></span>


là ilmet toujours la balise SmileyHappy1 dans le texterea mais le petit hic
grace a la class close il se ferme la fenetre mais si je réouvré la fenetre
il m'eface le smileys a cause de la class close

je te met mon nouveau code js au cas ou

jQuery(function($){
						   		   
	//When you click on a link with class of poplight and the href starts with a # 
	$('button.poplight').on('click', function() {
		var popID = $(this).data('rel'); //Get Popup Name
		var popWidth = $(this).data('width'); //Gets Popup Width

		//Fade in the Popup and add close button
		$('#' + popID).fadeIn().css({ 'width': popWidth}).prepend('<span class="icon-fermermondal close" title="Fermer"></span>');
		
		//Define margin for center alignment (vertical + horizontal) - we add 80 to the height/width to accomodate for the padding + border width defined in the css
		var popMargTop = ($('#' + popID).height() + 80) / 2;
		var popMargLeft = ($('#' + popID).width() + 80) / 2;
		
		//Apply Margin to Popup
		$('#' + popID).css({ 
			'margin-top' : -popMargTop,
			'margin-left' : -popMargLeft
		});
		
		//Fade in Background
		$('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
		$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer 
		
		return false;
	});
	
	
	//Close Popups and Fade Layer
	$('body').on('click', 'span.close, button.close, #fade', function() { //When clicking on the close or fade layer...
		$('#fade , .popup_block').fadeOut(function() {
			$('#fade, span.close, button.close').remove();  
	}); //fade them both out
		
		return false;
	});

	
});


maintenant il faut juste lui dire qu'il ne faut pas effacé le smileys lors du clique juste la fenetre
> enora
c'est bon je vien juste trouvé mon erreur

merci