使按鈕onclick調用一個函數而不是表單操作

我已經寫了一個JavaScript函數來調用我的button.onclick()事件，但函數沒有被調用。相反，我的表單行爲是執行的。使按鈕onclick調用一個函數而不是表單操作

HTML：

<form id = "Documents" action="Uploaded.php"> 
<input type="submit" id="Remove1" name="Remove[1]" value="Remove first" onclick="return Remove('Remove1');"> 
<input type="submit" id="Remove2" name="Remove[2]" value="Remove second" onclick=" return Remove('Remove2');"> 
</form>

更新的JavaScript：

function Remove(currentDoc) 
{ 
if (window.XMLHttpRequest) 
     { 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("Removemsg").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET","functions/remove.php?Doc="+currentDoc,true); 
xmlhttp.send(); 

    return false; 
}

它調用uploaded.php，而不是我的remove.php。但是我已經定義了我的onclick函數來調用remove.php。好心提醒。

來源

2012-07-12 JLearner

您的JS無效：3'{'和5'}'。我認爲有一個問題... – Florent 2012-07-12 12:37:11

爲function remove()添加return false;聲明以防止表單提交。

，也是你的onclick="Remove()"應該onclick="return Remove();"

你的JS代碼也errorful

function Remove(currentDoc) 
{ 
if (window.XMLHttpRequest) 
    xmlhttp=new XMLHttpRequest(); 
else 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("Removemsg").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET","functions/remove.php?Doc="+currentDoc,true); 
xmlhttp.send(); 

    return false; 
}

來源

2012-07-12 12:34:47

如果你的意思是在Remove（）函數體的末尾添加一個'return false'，它是不正確的。此外，事件處理程序應該以這種方式進行更改：'onclick =「return Remove（'Remove1'）」' – 2012-07-12 12:56:29

@updated，看到更改 – 2012-07-12 12:58:17

添加，但它仍然自動下載uploaded.php而不是調用remove。 – JLearner 2012-07-12 13:03:09

因爲這是一個提交按鈕，將默認的形式提交給action屬性的URL。

爲了防止它，你需要在你的函數結束返回false：

function Remove(currentDoc) 
{ 
if (window.XMLHttpRequest) 
    xmlhttp=new XMLHttpRequest(); 
    } 
else 
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
xmlhttp.onreadystatechange=function() 
    { 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("Removemsg").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET","functions/remove.php?Doc="+currentDoc,true); 
xmlhttp.send(); 

return false; 
}

來源

2012-07-12 12:35:02 Tomer

它不起作用。仍然鏈接到我的主要形式的PHP。 – JLearner 2012-07-12 12:37:23

它不起作用，因爲它是這樣的： 'onclick =「false」' 但正確的是： 'onclick =「return false」' – 2012-07-12 13:05:42

使用<input type="button" />而不是<input type="submit" />防止形式submittion

來源

2012-07-12 12:37:13 yogi

嘗試了你的方法。它不叫我的功能 – JLearner 2012-07-12 12:43:19

你有一個有效的'HTML'我懷疑這個'name =「刪除[1]」'，在名稱中使用[]是無效的我猜。 – yogi 2012-07-12 12:46:40

即使我刪除[1]，它仍然不會呼叫。奇怪的:( – JLearner 2012-07-12 12:50:58

-3

如果使用的是JavaScript，然後有不需要使用<form>。

來源

2012-07-12 12:39:14

你的回答沒有意義... – PPvG 2012-07-12 12:48:42

你的答案不可以理解！ – fsenart 2012-07-12 14:58:13

而不是使用<input type="submit" ... />產生按鈕，你也可以使用<button>標籤（MDN docu）

<button type="button" id="Remove1" name="Remove[1]" onclick="Remove('Remove1')">Remove first</button>

，這將產生一個按鈕。通過設置type="button"，您可以防止觸發表單提交的默認（type="submit"）。

來源

2012-07-12 12:39:23 Sirko

我已經爲我的

當你點擊提交按鈕時，提交表單很自然。如果你想阻止這個，你應該在你的事件處理函數中返回false。注意，在你刪除函數結束返回false是不夠的，你應該寫這樣的事情：

<input type="submit" id="Remove1" name="Remove[1]" value="Remove first" onclick="return Remove('Remove1')">

和你remove函數應返回false。也注意到你的ajax編碼存在語義錯誤。你應該在調用xmlhttp對象的open（）函數後設置onReadyStateChange。請訪問here獲取更多信息

來源

2012-07-12 12:45:13

試過，但它並沒有調出我的刪除功能，即使我已經改變警報（'這'）; – JLearner 2012-07-12 12:47:56

是否阻止表單提交？ – 2012-07-12 13:00:05

不，它仍然會調用上傳文件。 – JLearner 2012-07-12 13:03:37

使按鈕onclick調用一個函數而不是表單操作

回答

相關問題