0
Ich habe versucht, ein Formular in Jquery Mobile zu schreiben. Alle Feldbezeichnungen haben ein Popup-Symbol. Diese Form hat gut funktioniert, aber jetzt gibt es ein Problem! Wenn ich im unteren Popup-Symbol geklickt habe, öffne das Popup oben im Formular und an einer festen Position. Ich weiß nicht, was passiert ist. Bitte hilf mir. Danke.alle pop-up Datenposition von Jquery mobile Show in feste Position
<form class="form-inline" role="form" method="post" action="php/formUserP1.php" id="formP1" name="formP2">
<fieldset class="ui-grid-a">
<h2 class="ui-block-a">
<sup class="dont-print">
<a href="#Page01Tooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a>
</sup>
<div data-role="popup" id="Page01Tooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Personal Information
</p>
</div>
</h2>
<div id="imageBlock" class="ui-block-b" align="center">
<!-- Image -->
<div id="imagePreview"></div>
<div class="fileUpload">
<span>
Image
</span>
<input id="uploadImage" type="file" class="upload" name="image" />
<sup class="dont-print">
<a href="#uploadImageTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a>
</sup>
<div data-role="popup" id="uploadImageTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Your Image
</p>
<img src="images/image-sample.jpg">
</div>
</div>
<!-- End of Image -->
</div>
</fieldset>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="FirstNameFa" id="00" >
FirstNameFa
<sup class="dont-print">
<a href="#FirstNameFaTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="FirstNameFaTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Write your first name using the Persian alphabet.
</p>
</div>
</label>
<input type="text" class="form-control input" data-clear-btn="true" placeholder=" "
name="FirstNameFa" id="FirstNameFa" maxlength="40" required>
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="FirstNameEn">
FirstNameEn
<sup class="dont-print">
<a href="#FirstNameEnTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="FirstNameEnTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
In Latin script, write your first name as it appears in your passport.
</p>
</div>
</label>
<input type="text" class="form-control" data-clear-btn="true" placeholder="Your First Name in English"
name="FirstNameEn" id="FirstNameEn" maxlength="40" required>
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="LastNameFa">
LastNameFa
<sup class="dont-print">
<a href="#LastNameFaTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="LastNameFaTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Write your family name using the Persian alphabet.
</p>
</div>
</label>
<input type="text" class="form-control" data-clear-btn="true" placeholder=" "
name="LastNameFa" id="LastNameFa" maxlength="40" required>
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="LastNameEn">
.
<sup class="dont-print">
<a href="#LastNameEnTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="LastNameEnTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p>
In Latin script, write your family name as it appears in your passport.
</p>
</div>
</label>
<input type="text" class="form-control" data-clear-btn="true" placeholder="Your Last Name in English"
name="LastNameEn" id="LastNameEn" maxlength="40" required>
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<fieldset data-role="controlgroup" data-type="horizontal" id="Gender">
<legend>
Gender
<sup class="dont-print">
<a href="#GenderTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="GenderTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
What is your gender
</p>
<ul dir="ltr">
<li>
Male
</li>
<li>
Female
</li>
</ul>
</div>
</legend>
<label for="Male" class="radio-inline">
<input type="radio" class="form-control" name="Gender" value="1" id="Male" required>
</label>
<label for="Female" class="radio-inline">
<input type="radio" class="form-control" name="Gender" value="2" id="Female"
</label>
</fieldset>
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="PassportNo">
PassportNo
<sup class="dont-print">
<a href="#PassportNoTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="PassportNoTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Write your passport number.
</p>
</div>
</label>
<input type="text" data-clear-btn="true" class="form-control" placeholder=": A11487661"
name="PassportNo" id="PassportNo" maxlength="30" required>
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
Nationality
<sup class="dont-print">
<a href="#NationalityTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="NationalityTooltip" class="ui-content" data-overlay-theme="a">
What is your nationality
</div>
</div>
<div>
BirthDate
<a href="#BirthDateTooltip" data-rel="popup" data-transition="flip"
class=" ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title="Help"></a>
<div data-role="popup" id="BirthDateTooltip" class="ui-content" data-overlay-theme="a">
Write your birthdate as it appears in your passport (day, month, year according to the Gregorian calendar)
</div>
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="CountryBirth">
CountryBirth
<sup class="dont-print">
<a href="#CityBirthTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="CityBirthTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Write the name of the country and the city in which you were born.
</p>
</div>
</label>
<fieldset data-role="controlgroup" data-type="horizontal">
<select class="form-control" name="CountryBirth" id="CountryBirth" dir="ltr">
<option value="">
</option>
</select>
</fieldset>
<input type="text" data-clear-btn="true" class="form-control" placeholder=" . : "
name="CityBirth" id="CityBirth" maxlength="30">
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="CountryResidence">
CountryResidence
<sup class="dont-print">
<a href="#CountryResidenceTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="CountryResidenceTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Write the name of the country and the city in which you live now.
</p>
</div>
</label>
<fieldset data-role="controlgroup" data-type="horizontal">
<select class="form-control" name="CountryResidence" id="CountryResidence" dir="ltr">
<option value="">
</option>
</select>
</fieldset>
<input type="text" data-clear-btn="true" class="form-control" placeholder=" . : "
name="CityResidence" id="CityResidence" maxlength="30">
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="HomeTel">
HomeTel
<sup class="dont-print">
<a href="#HomeTelTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="HomeTelTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Write your home phone number, including the city and country code.
</p>
</div>
</label>
<input type="number" data-clear-btn="true" class="form-control" placeholder=": 00982122414393"
name="HomeTel" id="HomeTel" maxlength="15">
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="Mobile">
Mobile
<sup class="dont-print">
<a href="#MobileTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="MobileTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Write your cell phone number, including the country code.
</p>
</div>
</label>
<input type="number" data-clear-btn="true" class="form-control" placeholder=": 0098912345678901"
name="Mobile" id="Mobile" maxlength="15" >
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="WorkTel">
WorkTel
<sup class="dont-print">
<a href="#WorkTelTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="WorkTelTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Write your work phone number, including the city and country code.
</p>
</div>
</label>
<input type="number" data-clear-btn="true" class="form-control" placeholder=": 00982122414393"
name="WorkTel" id="WorkTel" maxlength="15">
</div>
<div data-role="fieldcontain"> <!-- for inline label and input -->
<label for="Email">
Email
<sup class="dont-print">
<a href="#EmailTooltip" data-rel="popup" data-transition="flip"
class="my-tooltip-btn ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-mini"
title=" "></a></sup>
<div data-role="popup" id="EmailTooltip" class="ui-content" data-overlay-theme="a"
style="max-width:350px;">
<p dir="ltr">
Your email address.
</p>
</div>
</label>
<input type="email" data-clear-btn="true" class="form-control" name="Email" id="Email" disabled/>
</div>
<br>
<input type="submit" class="form-control dont-print" data-icon="arrow-l" data-inline="true" name="next02" id="next02" value=" ">
<br>
</form>
Ich habe meine Seite in Firefox geöffnet und es funktioniert. Aber in Chrome funktioniert es nicht –