사람들이 클릭하여 모달 팝업 양식을 작성한 다음 세부 정보를 전자 메일로 보낼 수 있도록 다음 웹 페이지에 "쿠폰 만들기"버튼을 추가하려고합니다.Javascript/jQuery 변수가 HTML로 인쇄됩니다.
모달은 잘 작동하지만 HTML에서 출력 할 변수를 얻지 못하는 것 같습니다. 이 페이지에서
테이블 행에 대한 HTML 코드입니다 :<tr>
<td></td>
<td class="date">1967</td>
<td class="desc">(F257 Dies 3+J. S4157). BU Full Lustre</td>
<td class="price">£0.20</td>
<td class="nogrey"><a href="http://ww6.aitsafe.com/cf/add.cfm?userid=8935970&product=Item+714.+1d+1967+BU+Full+Lustre&price=0.20&return=http%3A%2F%2Fwww.colincooke.com%2Fcoinpages%2Fpennies.html" target="_self"><div class="cart-button"></div></a><a href="#dialog1" name="modal"><div class="offer-button"></div></a></td>
</tr>
그리고 이것은 모달 팝업을하고 버튼을 클릭에서 값을 얻을 수있는 자바 스크립트/jQuery 코드입니다 - 모달 물건이 아닌 내 - 코드 변수를 저장하는 유일한 물건 (아마 더 우아한 수 :
<script type="text/javascript">
$(document).ready(
function()
{
$.localScroll();
$("table.stocktable a.coinpic").fancybox({ 'zoomSpeedIn': 300, 'zoomSpeedOut': 300, 'overlayShow': false });
$("div.offer-button").click(function(){
// add item text to variables
// THIS IS MY (amateur!) CODE BLOCK BELOW:
var itemDate = $(this).parent().parent().parent().children("td.date").text();
var itemDescription = $(this).parent().parent().parent().children("td.desc").text();
var itemPrice = $(this).parent().parent().parent().children("td.price").text();
});
// Is there a better/more direct way of doing the above? It currently works - but could be neater I think.
// MODAL BELOW
//select all the a tag with name equal to modal
$('a[name=modal]').click(function(e) {
//Cancel the link behavior
e.preventDefault();
//Get the A tag
var id = $(this).attr('href');
//Get the screen height and width
var maskHeight = $(document).height();
var maskWidth = $(window).width();
//Set heigth and width to mask to fill up the whole screen
$('#mask').css({'width':maskWidth,'height':maskHeight});
//transition effect
$('#mask').fadeTo("medium",0.8);
//Get the window height and width
var winH = $(window).height();
var winW = $(window).width();
//Set the popup window to center
$(id).css('top', winH/2-$(id).height()/2);
$(id).css('left', winW/2-$(id).width()/2);
//transition effect
$(id).fadeIn(250);
});
//if close button is clicked
$('.window .close').click(function (e) {
//Cancel the link behavior
e.preventDefault();
$('#mask').hide();
$('.window').hide();
});
//if mask is clicked
$('#mask').click(function() {
$(this).hide();
$('.window').hide();
});
}
);
</script>
은 내가 변수가 항목의 사진, 설명 및 가격 저장 얻을 관리했습니다 생각 (I 경고를 시도하고 보였다)하지만 지금은 모달 변수를 출력하고 싶습니다. 승자가 나타납니다. 그것은 즉
는 말한다 :
<div id="boxes">
<!-- Start of Login Dialog -->
<div id="dialog1" class="window">
<div class="d-header">
//I entered this message
You are making an offer for:
<input type="text" value="username"/><br/>
<input type="password" value="Password" />
</div>
<div class="d-blank"></div>
<div class="d-login"><input name="Login" type="button" value="Login" /></div>
</div>
<!-- End of Login Dialog -->
</div>
: 모달 팝업 페이지에이 코드를 사용
:
는 "itemDate, itemDescription, itemPrice 당신이 제안을하고있다"
그리고 사용 해보 았습니다 :
You are making an offer for: <script language="javascript"> document.write (itemDate); </script>
하지만 누군가에게 명백한 이유 때문에이 방법은 효과가 없습니다. 어쩌면 jQuery에 의해 저장된 변수가 해당 코드 외부에서 사용 가능하지 않을 수도 있습니다. itemDate, itemDescription 및 itemPrice에 의해 저장된 jQuery 변수를 HTML 모달 양식의 올바른 위치에있는 HTML 코드로 출력하려면 어떻게합니까?
나는 "HTML에서 jQuery 변수 인쇄"를 검색했지만 관련된 내용을 찾을 수 없습니다. 이것은 너무 명백하거나 불가능합니다.
도움을 주시면 감사하겠습니다.
많은 감사 나는 JQuery와 설명서의 APPEND/앞에 추가 기능을 찾아 볼 것이다 당신이라면
좋아, 그래서 나는 쓰레기 해요,하지만 내가 뭘하려하고 나는 그것이 기본 기능인 자바 스크립트를 알고 있지만 헤이, 내가 leraning 해요 :
당신이 제안을하고 있습니다 :
작동하지 않습니다. 변수 itemDate를 추가하려면 어떻게해야합니까? (즉, 어떻게 정확하게 참조해야합니까?) 링크를 제공해 주셔서 감사합니다. 문서를 좋아합니다! – alsheron도이 시도 :
– alsheron좋아, 내가 그것을 고정 된 생각 : 필요한 : $ (문서) .ready을 ( \t \t 기능() \t { 와 닫는 비트 이 항상 jQuery를 변수를 참조 할 필요가있다.? 또는 그들을 세계적으로 선언하는 방법이 있습니까? – alsheron