2011-05-02 198 views
0

我試圖把一個網頁,會彈出一個形式,用戶通過電子郵件共享網頁上的鏈接...爲什麼不調用這個函數?

<a href="javascript:function()"><img src="images/email.jpg"></a> 

    <div id="tellfriend"> 
    <form id='tellafriend_form' method="post" onsubmit="return executeOnSubmit();" 
    action="sharemail.php" name="tellafriend_form"> 
     <label for="name">Your Name:</label> 
     <input class="std_input" type="text" id="name" name="name" size="40" maxlength="35" value=""> 
     <label for="to">Recipient's Email:</label> 
     <input class="std_input" type="text" id="to" name="email" size="40" maxlength="35"> 
     <label for="message">Message:</label> 
     <textarea id="message" name="message" rows="18" cols="40"> 
message here</textarea> 
     <input type="submit" onclick="javascript: pageTracker._trackPageview('/share/wf360');" name="submit" class="form_but" value="Submit"> 
    </form> 
    </div><!-- #tellfriend --> 

這裏是我使用的JavaScript(除了jQuery的) :

<script> 
jQuery.fn.fadeToggle = function(speed, easing, callback) { 
return this.animate({opacity: 'toggle'}, speed, easing, callback); 
}; 

$(document).ready(function() { 
    $('#tellfriend').hide(); 
    $('a.email, #tellfriend a.close').click(function() { 
    $("#tellfriend").fadeToggle('slow'); 
    }); 
}); 
</script> 
<script type="text/javascript"> 
function executeOnSubmit() 
{ 
alert('Email has been successfully sent. Thanks for sharing!'); 
} 
</script> 

我不知道爲什麼它不工作:窗體不彈出。

+0

噢不,函數是[保留字](http://www.ecma262-5.com/ELS5_Section_7.htm#Section_7.6.1.1),不能用作函數名。 – 2011-05-02 21:08:52

+0

我用什麼來代替?我從別人身上繼承了這一點,我不知道他們想要什麼......謝謝。 – blackessej 2011-05-02 21:12:43

+0

第二個想法是,你嘗試在你顯示的第一行中調用一個名爲'function'的函數,但是沒有這個名字的函數。點擊電子郵件圖像時應該調用哪個函數? – 2011-05-02 21:15:58

回答

2

看來你試圖替換已有的fadeToggle()函數。

此外,現有的fadeToggle()函數不接受'toggle'作爲不透明度的值。引用jQuery API頁面:

.fadeToggle()的工作原理與.fadeOut()和.fadeIn()相同。像.fadeOut(),.fadeToggle()將淡出元素,如果他們是可見的;像fadeIn(),它會淡入隱藏的元素。即使元素從不透明度0開始,如果它佔據文檔中的空間(即,它具有高度或寬度),它也不被視爲隱藏。對於具有可見性的元素也是如此:隱藏。您可以使用.fadeTo()或.animate()將一個元素從一個不透明度淡入到另一個不透明度而不影響其顯示屬性。但是,如果您這樣做了,那麼最初具有display:none的元素不會僅僅因爲您爲不透明度設置動畫而變得可見。希望有所幫助。

因此,請嘗試刪除您在開頭添加的功能,它看起來像其餘的代碼應該沒問題。


更新:

看你的網站後,它將顯示你有jQuery的。5.0(不具有fadeToggle()和V1.5.2裏面確實有它的兩個副本,但你在裝載很多其他腳本之後加載v1.5.2 ...因爲這個,我在「$不是函數」的螢火蟲上發生了一個錯誤,所以,試着完全替換v1.4.2(第一個腳本標籤)與v1.5.2 ....並獲得螢火蟲;)

而實際上,腳本確實工作 - 但其他腳本可能會因出於以上原因。表單在第一張圖片旁邊的頂部彈出WAY。您需要將位置從絕對位置改爲relative,並在CSS中將left調整爲130px左右。

+0

我已經更新了我的答案! :P – Mottie 2011-05-04 05:05:42

+0

非常有幫助。是的,該網站是一團糟。我繼承了這個項目,接下來的步驟將清理遍佈各處的腳本和CSS。謝謝! – blackessej 2011-05-04 14:03:10

3

答:http://jsfiddle.net/morrison/f3Uy2/

注:

  • 使用jQuery中的fadeToggle()功能。
  • 請注意對html的更改(如果您願意,請忽略小貓)。
+1

明確表示「忽略小貓,如果你願意的話」。另外,我的意思是...它的工作原理。 – rockerest 2011-05-02 22:06:31

+0

嘿,現在!小貓有什麼問題! o.O ... +1爲好的演示;) – Mottie 2011-05-02 22:49:33

+0

我只是可能會讓小貓在那裏。大演示。儘管如此,它並不適用於我的網頁。 https://naturesfootprintinc.com/mjf在最底層。我意識到html和header鏈接是一團糟 - 我繼承了這個項目並且不承擔任何責任! – blackessej 2011-05-03 16:29:38

相關問題