Ik probeer dit dialoogvenster te laten verschijnen wanneer op deze link wordt geklikt, maar het werkt niet voor mij. Ik ben hier de afgelopen drie uur mee bezig geweest en dit begint me te frustrerend te worden.
Hier is mijn HTML:
<a href="#" id="contactUs">Contact Us</a>
<div id="dialog" title="Contact form">
<p>appear now</p>
</div>
En hier is mijn JavaScript, dit staat in een extern bestand:
$("#contactUs").click(function() {
$("#dialog").dialog("open");
return false;
});
Ik heb deze links gebruikt, maar het mocht niet baten:
Laat het me weten als je een idee hebt, zeer gewaardeerd, bedankt.
Antwoord 1, autoriteit 100%
Deze HTML is in orde:
<a href="#" id="contactUs">Contact Us</a>
<div id="dialog" title="Contact form">
<p>appear now</p>
</div>
U moet het dialoogvenster initialiseren (niet zeker of u dit doet):
$(function() {
// this initializes the dialog (and uses some common options that I do)
$("#dialog").dialog({
autoOpen : false, modal : true, show : "blind", hide : "blind"
});
// next add the onclick handler
$("#contactUs").click(function() {
$("#dialog").dialog("open");
return false;
});
});
Antwoord 2, autoriteit 14%
Uw probleem ligt bij de oproep voor de dialoog
Als u het dialoogvenster niet initialiseert, hoeft u “open” niet door te geven om het te laten zien:
$("#dialog").dialog();
Deze code moet ook op een functie $(document).ready(); staan of onder de elementen staan om te kunnen werken.
Antwoord 3, autoriteit 10%
Gebruik onderstaande code, het werkte voor mij.
<script type="text/javascript">
$(document).ready(function () {
$('#dialog').dialog({
autoOpen: false,
title: 'Basic Dialog'
});
$('#contactUs').click(function () {
$('#dialog').dialog('open');
});
});
</script>
Antwoord 4, autoriteit 8%
Het is vrij eenvoudig, eerst moet HTML worden toegevoegd:
<div id="dialog"></div>
Vervolgens moet het worden geïnitialiseerd:
<script type="text/javascript">
jQuery( document ).ready( function() {
jQuery( '#dialog' ).dialog( { 'autoOpen': false } );
});
</script>
Hierna kunt u het per code laten zien:
jQuery( '#dialog' ).dialog( 'open' );
Antwoord 5, autoriteit 2%
U kunt het volgende script gebruiken. Het werkte voor mij
De modal zelf bestaat uit een modale hoofdcontainer, een koptekst, een hoofdtekst en een voettekst. De voettekst bevat de acties, in dit geval de OK-knop, de koptekst bevat de titel en de sluitknop, en de hoofdtekst bevat de modale inhoud.
$(function () {
modalPosition();
$(window).resize(function () {
modalPosition();
});
$('.openModal').click(function (e) {
$('.modal, .modal-backdrop').fadeIn('fast');
e.preventDefault();
});
$('.close-modal').click(function (e) {
$('.modal, .modal-backdrop').fadeOut('fast');
});
});
function modalPosition() {
var width = $('.modal').width();
var pageWidth = $(window).width();
var x = (pageWidth / 2) - (width / 2);
$('.modal').css({ left: x + "px" });
}
Raadpleeg:- Modal pop-up met jQuery in asp.net
Antwoord 6
Je kunt deze link bekijken:
http://jqueryui.com/dialog/
Deze code zou goed moeten werken
$("#dialog").dialog();