2014-12-07 27 views
-4

爲什麼這段代碼不起作用?我多次檢查過它,但找不到錯誤!我只是做了一些jQuery和表單的實驗,但它似乎不想工作!jquery和簡單事件

<!doctype html> 
<head> 
<meta charset="utf-8"> 

<title>Mini Blog</title> 
<meta name="description" content="My Parse App"> 
<meta name="viewport" content="width=device-width"> 
<link rel="stylesheet" href="css/try.css"> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://www.parsecdn.com/js/parse-1.3.2.min.js"></script> 
</head> 

<body> 
<div id="myID"></div> 
<script type="text/javascript"> 

    var postTitle = $("#postTitle").val(); 
    var postText = $("#postText").val(); 
    var sexAuthor = $("#sexAuthor").val(); 
    var cityAuthor = $("#cityAuthor").val(); 


    $("#button").click(function() 
    { 
     string = postTitle + postText + sexAuthor + cityAuthor; 
     $("#visualize").text("a"); 
     alert('amama'); 
    }); 


</script> 


    <h2>Title:</h2> <br> 
    <input type="text" id="postTitle"> <br> 
    <h2>Contenuto del post:</h2> 
    <input type="text" id="postText"> <br> 
    <h2>Sei..?</h2> 
    <input type="radio" id="sexAuthor" value="M"> M <br> 
    <input type="radio" id="sexAuthor" value="F"> F <br> 
    <h2>Vieni da:</h2> <br> 
    <option> - Scegli città zì - </option> 
    <select id="city"> 
     <option value="Roma"> Roma </option> 
     <option value="Milano"> Milano </option> 
    </select> <br> 
    <button id="button"> Inviame zì! </button> <br> 
    <p id="visualize"></p> 


</body> 

</html> 
+2

定義「不起作用」。你期望什麼行爲?這與發生的情況有何不同? JavaScript錯誤控制檯說什麼?您是否已通過檢查瀏覽器中的開發者工具的網絡標籤確認您的所有文件正在加載? – Quentin 2014-12-07 10:27:00

+0

請[學習愛標籤](http://www.456bereastreet.com/archive/200711/use_the_label_element_to_make_your_html_forms_accessible/)而不是使用小標題。 – Quentin 2014-12-07 10:27:19

+0

如果您執行此代碼會發生什麼? – 2014-12-07 10:30:02

回答

1

您必須確保在嘗試使用js查找它們之前,要使用javascript訪問的DOM元素已加載。您應該將您的腳本放在html下面,正好位於</body>標籤的前面,並將它們(大部分)包裝在文檔就緒功能中。

$(document).ready(function() { 
var postTitle = $("#postTitle").val(); 
    var postText = $("#postText").val(); 
    var sexAuthor = $("#sexAuthor").val(); 
    var cityAuthor = $("#cityAuthor").val(); 


    $("#button").click(function() 
    { 
     var string = postTitle + postText + sexAuthor + cityAuthor; 
     $("#visualize").text("a"); 
     alert('amama'); 
    }); 

}); 

其他問題,爲什麼你會不會後來發現收音機的設定值的,是你的HTML:

<input type="radio" id="sexAuthor" value="M"> M <br> 
<input type="radio" id="sexAuthor" value="F"> F <br> 

你可以給一個ID只有一個DOM元素。但是,你可以把它改成類,給他們一個名稱,並檢查選擇其中之一:

alert($('input[name=sexAuthor]:checked').val()); 

HTML

<input type="radio" class="sexAuthor" name = "sexAuthor" value="M"> M <br> 
<input type="radio" class="sexAuthor" name = "sexAuthor" value="F"> F <br> 
<h2>Vieni da:</h2> <br> 
-1

什麼是你想使這個代碼呢?它似乎在這裏工作:http://jsfiddle.net/4hvab248/2/

您可能想要在#button點擊函數中聲明var string = ...只是爲了清潔。

+0

是的,它是這個問題,因爲即使我替換按鈕點擊功能裏面的var字符串也不行! – 2014-12-07 10:32:27