2011-06-01 67 views
0

問題:我不知道爲什麼我的腳本不值裝入一個形式的選擇輸入部分寫網址,形成輸入值

方案: 頁面,稱之爲主機頁面,永久顯示一個包含鏈接的對話框作爲內容。如果用戶點擊鏈接另一個對話框,將其稱爲「表單對話框」,並打開一個表單。有些項目通過主機頁面的代碼平臺,瀏覽器和url插入到表單中。

這是不工作的URL。

該URL在主機頁面上獲取並存儲爲.data項目以通過「表單對話」腳本進行恢復。 我在一個更簡單的設置上測試了它,但它完美地工作,但它拒絕在當前設置上工作。

症狀: 該URL是按預期方式讀取和存儲的,但該腳本未將其寫入表單中。我使用的方法是在首次加載對話框時添加回調函數。回調函數使用.val()函數將數據寫入表單,或者至少這是意圖。 在對話框設置過程中將值寫入窗體,以便用戶單擊時已將信息加載到窗體中。

我很感激任何關於什麼可能是問題的原因和/或如何糾正它的指針或建議。

謝謝。

腳本:

enter <script type="text/javascript"> 
//Triggers a modal containing the feedback form. 
$(document).ready(function() { 
$('#target a').each(function() { 
    var $link = $(this); 
    var $dialog = $('<div></div>') 
     .load($link.attr('href')) 
     .dialog({ 
      autoOpen: false, 
      title: $link.attr('title'), 
      width: 600, 
      height: 500, 
      modal: true, 
      open: function (event,ui) { 
       $("input[name='url']").val($('body').data('value2')); 


      } 
     }); 

    $link.click(function() { 
     $dialog.dialog('open'); 
     $("#accordion").accordion({ 
      collapsible: true, 
      active: false 
     }); 
     return false; 
    }); 
}); 
}); 
</script> 

主頁

<html xmlns="http://www.w3.org/1999/xhtml"> 

</head> 

<body> 


<!--Script to get the url of the page and store it as a data item for use on the form --> 
<script type="text/javascript"> 
<?php 
    $url = "http://".$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI']; 
    ?> 
var pageAddress="<?php echo $url?>"; 

$('body').data('value2', pageAddress); 

</script> 
<p>The following just confirms that the url is being stored on the page</p> 
<div> 
The URL value stored on the page is 
<span id='urlcheck'></span> 
<p>The location is 
</p> 

<script type="text/javascript"> 
$("span#urlcheck").html("<p>" +$("body").data("value2")+ "</p>"); 
</script> 
</div> 



<!--Check to see if the cookie is set --> 
<?php include ('../_assets/include_files/checkreaderStatus.php');?> 
<!-- The following file is for development only. It adds a navigation menu to pages in which its included. --> 
<?php include('../_assets/include_files/navigation.html');?> 
<!---------------------------------------------------------------------------> 
<!-- Start The Page Display --> 
<h1>Page 1 Of The Blog</h1> 
<p>This page simulates the page on the blog where testers will land.</p> 

<!--Dialog for the "Feedback Form Button --> 
<script type="text/javascript"> 
//Reads the flag readerStatus, if set creates a dialog with a permanently displayed "Feedback Button". NOTE TO SELF: This has to be on the page in order for the php to be to be processed by the server! 
var readerStatus="<?php echo $readerStatus; ?>"; 
if (readerStatus == "tester") { 
    $(function(){ 
     $("#dialog").dialog(); 
       }) 
} 
</script> 

<!-- Content for the Feedback Form Button --> 
<div id="dialog" title="Feedback Button"> 
<div title="Feedback Form"> 
    <p id='target'><a href="feedbackform.php" title='Feedback Form' >Feedback Form</a></p> 
    <p class="notes">This form is dragable and resizable</p> 
</div> 
</div> 




<script type="text/javascript"> 
//Triggers a modal containing the feedback form. 
$(document).ready(function() { 
$('#target a').each(function() { 
    var $link = $(this); 
    var $dialog = $('<div></div>') 
     .load($link.attr('href')) 
     .dialog({ 
      autoOpen: false, 
      title: $link.attr('title'), 
      width: 600, 
      height: 500, 
      modal: true, 
      open: function (event,ui) { 
       $("input[name='url']").val($('body').data('value2')); 


      } 
     }); 

    $link.click(function() { 
     $dialog.dialog('open'); 
     $("#accordion").accordion({ 
      collapsible: true, 
      active: false 
     }); 
     return false; 
    }); 
}); 
}); 
</script> 
</body> 
</html> 

反饋表 反饋表

<link rel="stylesheet" type="text/css" href="../_assets/scripts/black-tie/jquery-ui-1.8.4.custom.css" /> 
</head> 

<body> 



<?php 
$browser = get_browser(null, true); 
?> 
<!-- ajax form next? --> 
<script type="text/javascript"> 
$(document).ready(function() { 
var options = { 
    target : '#output1', 
    url: 'comments.php', 
    clearForm: 'true' 
}; 
// bind 'myForm' and provide a simple callback function 
$('#myform').ajaxForm(options); 
return false; 
}); 
</script> 
<!-- Script to execute text prompts in the fields --> 
<!-- optional name --> 
<script type="text/javascript" id="demoscript"> 
$(document).ready(function(){ 
    //Optionsal Name 
    $("#textTagDemo").fieldtag(); 
    //Textarea 
    $("#area").fieldtag(); 
}); 
</script> 







<div id="accordion"> 
<h3><a href="#">Instructions</a></h3> 
    <div> 
     <p> 
     Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer 
     ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit 
     amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut 
     odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate. 
     </p> 
    </div> 
<h3><a href="#">Broken Links</a></h3> 
<div> 
<form action="comments.php" method="post" name="broken_Links" id="myform" > 
       <fieldset> 
        <p> 
         <input name="name" type="text" size="50" id="textTagDemo" title="OPTIONAL: Add your name" /> 

        </p> 
        <p> 
         <input name="nowhere" type="radio" value="linknowhere" />Link is 
         broken and doesn't go anywhere 
        </p> 
        <p> 
         <input name="wrong_url" type="radio" value="linktowrongurl" />Link 
         goes to an unexpected destination 
        </p> 
        <p> 
         <input name="other" type="radio" value="linkother" />Other - 
         Please explain in the description box below 
        </p> 
        <em>Description</em> 
        <p>Please add as much descripton as you can about the problem you 
         noticed</p> 
        <textarea name="description" id="area" cols="50" rows="10" title="Please add as much description as you can."></textarea> 
        <p> 
         Page Address: <br /> <input name="url" type="text" value="" 
          id="targetURL" size="100" title="Page Address" /> 
        </p> 
        <p> 
         Browser<input name="browser" type="text" 
          value="<?php echo $browser['browser'] ?>" /> 
        </p> 
        <p> 
         Operating System<input name="operating_system" type="text" 
          value="<?php echo $browser['platform'] ?>" /> 
        </p> 
        <p> 
         <input type="submit" name="submit" id="button" value="Submit" /> 
        </p> 
       </fieldset> 
      </form> 
    <!-- server response --> 
      <h2>Output Response</h2> 
      <p id="output1"> 

      </p> 
      <!--End form 4 broken links--> 
</div> 
<h3><a href="#">Errors In The Text</a></h3> 
<div> 
    <p> 
    Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. 
    Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero 
    ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis 
    lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. 
    </p> 
    <ul> 
     <li>List item one</li> 
     <li>List item two</li> 
     <li>List item three</li> 
    </ul> 
</div> 
<h3><a href="#">Confusing Layout</a></h3> 
<div> 
    <p> 
    Cras dictum. Pellentesque habitant morbi tristique senectus et netus 
    et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in 
    faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia 
    mauris vel est. 
    </p> 
    <p> 
    Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. 
    Class aptent taciti sociosqu ad litora torquent per conubia nostra, per 
    inceptos himenaeos. 
    </p> 
</div> 
</div> 
</body> 
</html> 
+0

您能否提供您希望看到的輸出示例以及您當前收到的錯誤輸出示例? – 2011-06-01 18:38:02

+0

有可能簡化這個問題有點可能,所以用戶不需要閱讀你的總體應用程序來幫助你?我,對於一個不回答這些'1000班輪'的職位。 – stefgosselin 2011-06-01 18:40:55

+0

@喬治康明斯:感謝您的反饋。我很抱歉,但失敗模式是一個空白的領域,我雖然描述了它,但在24小時後閱讀它,我看到它不清楚。 – dorich 2011-06-02 18:31:53

回答

1

我想的問題是,你把數據放到身體沒有它被包裹的$(document)。就緒()子句中。

爲了快速修復,您可以將url定義爲一個變量,然後在您的腳本中訪問該變量。

例如:

http://jsfiddle.net/LF2rs/1/

PS: 我會建議讀成(使用模板)的分隔條件的PHP代碼,你的JavaScript(將它們放置在seperately .js文件!)。這將使它更容易和易於發現和防止錯誤。

+0

感謝您的回覆。這解決了問題,但我所做的只是用.val(變量)替換.val(.data)。我有點困惑 - 這個變量是在頁面上的一個小腳本中聲明的,它使用php來讀取URL,然後將結果轉換爲js變量。我會認爲變量的範圍意味着它不能用於其他腳本,但也許我不明白「變量範圍」。關於你的ps的一個問題:我認爲從php到js獲取變量的方法是將php嵌入到js中。那是不正確的,是否有另一種方法? – dorich 2011-06-02 15:11:27

+0

關於爲什麼它沒有工作是你在加載jQuery之前使用jQuery。我通常只對內部變量使用內聯javascript,但最好在頁面外定義的函數或方法中使用,並依賴於json。例如。 on load:startMyPage({... json對象或變量在這裏..});你對變量範圍也是正確的:我不確定,但我相信文檔中定義的東西一般在全局範圍內(有一個層次結構)。請參閱:http://stackoverflow.com/questions/500431/javascript-variable-scope – Arend 2011-06-02 15:16:50

+0

@阿倫德。感謝後續非常有幫助。爲了強化你對全局變量的評論,W3Schools表示,如果一個變量被定義在一個函數之外,那麼它可用於網頁上的任何腳本或函數。作爲解釋的一個例子,我還發現全局變量被附加到窗口對象,參見[this](http://snook.ca/archives/javascript/global_variable)。感謝JSON的提示,我需要去學習,瞭解它,但我總是想到這個想法。 – dorich 2011-06-02 18:27:23