台灣最大程式設計社群網站
線上人數
1105
 
會員總數:246691
討論主題:190104
歡迎您免費加入會員
討論區列表 >> Java Script/ Node.js >> 請問如何將java script改為jQuery
[]  
[我要回覆]
1
回應主題 加入我的關注話題 檢舉此篇討論 將提問者加入個人黑名單
請問如何將java script改為jQuery
價值 : 100 QP  點閱數:1030 回應數:11
樓主

大家加油
初學者
799 905
8023 563
發送站內信

我想要兩個功能
1.按下單行文字框時,檢查兩個radio button是否選取,若沒有則出現警告訊息
2.按下checkbox,自動將新約的資料拷貝到續約。
原本的網頁內是沒有onkeydown與onclick等事件,我把這些動作加上後是可以跑

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>upload</title></head><body>
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery.autocomplete.js"></script>

<script type='text/javascript'>
function myFunction() {
var radioFlag = false;
var radios = document.getElementsByTagName('input');
for(var i=0;i<radios.length-1;i++){
if(radios[i].name=="v8"){
if(radios[i].checked){
radioFlag = true;
}
}
}
if(!radioFlag){
alert("新約內費用1或費用2未選取!");
}
}

function myFunction2() {
var radioFlag = false;
var radios = document.getElementsByTagName("input");
for(var i=0;i<radios.length-1;i++){
if(radios[i].name=="v10"){
if(radios[i].checked){
radioFlag = true;
}
}
}
if(!radioFlag){
alert("舊約內費用1或費用2未選取!");
}
}

function validatecheck() {
if (document.getElementById('v18').checked) {
//var radioFlag = false;
var data1 = document.getElementsByName('v8');
var data2 = document.getElementsByName('v10');
var data3 = document.getElementsByName('v9');
var data4 = document.getElementsByName('v11');
data2[0].checked=data1[0].checked;
data2[1].checked=data1[1].checked;
data4[0].value=data3[0].value;
//alert("data3-"+data3[0].value);
}
// else {
// alert("You didn't check it! Let me check it for you.")
//}
}
</script>


<table><tr><td>
<font size="2" color="#2E3A4D">新約</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<INPUT type='radio' name='v8' value='費用1' >費用1
<INPUT type='radio' name='v8' value='費用2' >費用2</td>
</tr>
<tr class="tabtitle">
<td width="25%" height="27">
<p style="margin-left: 15">
<font size="2" color="#2E3A4D">新約費用</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<input type='text' name='v9' onkeydown="myFunction()" value='' Size='40' /></td>
</tr>
<tr class="tabtitle">
<td width="25%" height="27">
<p style="margin-left: 15">
<font size="2" color="#2E3A4D">續約條件與新約相同</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<input type='checkbox' name='v18[]' id='var18' value='續約條件與新約相同' onclick="validatecheck()">
續約條件與新約相同</td>
</tr>
<tr class="tabtitle">
<td width="25%" height="27">
<p style="margin-left: 15">
<font size="2" color="#2E3A4D">舊約回饋獎勵</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<INPUT type='radio' name='v10' value='費用3' >費用3
<INPUT type='radio' name='v10' value='費用4' >費用4
</td>
</tr>
<tr class="tabtitle">
<td width="25%" height="27">
<p style="margin-left: 15">
<font size="2" color="#2E3A4D">續約費用</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<input type='text' name='v11' onkeydown="myFunction2()" value='' Size='40'/></td>
</tr></table>
</body></html>

現在因為被要求不能加入onkeydown與onclick等事件 所以我想使用jQuery,
但我使用第一個就失敗...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>upload</title></head><body>
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery.autocomplete.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert("I am an alert box!");
$('[name^='v9']').keypress(function(event) {
alert('yes1');
if ( $('[name^='v8']').is(":checked")) {
alert('yes');
}
else {
alert('no');
}
});
});
</script>


<table><tr><td>
<font size="2" color="#2E3A4D">新約</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<INPUT type='radio' name='v8' value='費用1' >費用1
<INPUT type='radio' name='v8' value='費用2' >費用2</td>
</tr>
<tr class="tabtitle">
<td width="25%" height="27">
<p style="margin-left: 15">
<font size="2" color="#2E3A4D">新約費用</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<input type='text' name='v9' value='' Size='40' /></td>
</tr>
<tr class="tabtitle">
<td width="25%" height="27">
<p style="margin-left: 15">
<font size="2" color="#2E3A4D">續約條件與新約相同</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<input type='checkbox' name='v18[]' id='var18' value='續約條件與新約相同'>
續約條件與新約相同</td>
</tr>
<tr class="tabtitle">
<td width="25%" height="27">
<p style="margin-left: 15">
<font size="2" color="#2E3A4D">舊約回饋獎勵</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<INPUT type='radio' name='v10' value='費用3' >費用3
<INPUT type='radio' name='v10' value='費用4' >費用4
</td>
</tr>
<tr class="tabtitle">
<td width="25%" height="27">
<p style="margin-left: 15">
<font size="2" color="#2E3A4D">續約費用</font></td>
<td width="58%" height="27" style="font-size:12;color:#2E3A4D">
<input type='text' name='v11' value='' Size='40'/></td>
</tr></table>

</body></html>

請問如何將我的java script語法改寫為jQuery語法呢?
謝謝∼

本篇文章發表於2013-12-25 16:31
1樓
回應

KKBruce
捐贈 VP 給 KKBruce 檢舉此回應
jQuery API Codumentation

書局中文版的書也很多,也寫的不錯。
且 jQuery 比 JavaScript 好學很多。

學好它,你就知道如何改寫了。
本篇文章回覆於2013-12-25 16:54
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
2樓
回應

凱爾
捐贈 VP 給 凱爾 檢舉此回應
->現在因為被要求不能加入onkeydown與onclick等事件 所以我想使用jQuery
先要有個觀念,JQuery是JavaScript的函式庫,沒道理JQuery做得到JavaScript做不到 ^_^
->按下單行文字框時,檢查兩個radio button是否選取,若沒有則出現警告訊息
關鍵字:textbox click jquery selector radio
->按下checkbox,自動將新約的資料拷貝到續約。
關鍵字:append

建議你可以寫一先簡單的Sample Code放在JsBin or JsFiddle
如有問題再放上來討論 ^_^
本篇文章回覆於2013-12-25 17:00
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
3樓
作者回應

大家加油
檢舉此回應
謝謝兩位
我試試看
本篇文章回覆於2013-12-25 17:05
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
4樓
作者回應

大家加油
檢舉此回應
請問 如果v8這個radio按鈕資料傳遞給v10這一組radio...這樣的寫法正確嗎?
因為得不到資料 謝謝
$("input[@name='v10']:checked").val($("input[@name='v8']:checked").val());
本篇文章回覆於2013-12-25 19:53
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
5樓
作者回應

大家加油
檢舉此回應
耍白痴 應該要做判斷
if ( $("input[@name='v8']".is(':checked') == true ) {
$("input[@name='v10']".is(':checked') = true;
}
可是這樣也不對....得多念點書....再試試看
本篇文章回覆於2013-12-25 19:58
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
6樓
作者回應

大家加油
檢舉此回應
修改之後
if (!$("input[@name='v8']:checked").val()=="費用1") {
$("input[@name='v10']:checked").val()="費用3";
$("input[name='v10']").attr('checked', true);
}
value可以丟過去 不過checked沒有改變.....
本篇文章回覆於2013-12-25 20:14
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
7樓
作者回應

大家加油
檢舉此回應
if (!$("input[@name='v8']:checked").val()=="費用1") {
// $("input[@name='v10']:checked").val()="費用3";
$("input[name='v10']").attr('checked', true);
}

請問如何偵測費用1這個選擇鈕被選擇 然後費用3這個選擇鈕被選擇...
否則...費用4就被選擇
謝謝 語法稍後會放在前輩指定的位置上
本篇文章回覆於2013-12-25 20:21
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
8樓
作者回應

大家加油
檢舉此回應
我放在以下的位置

http://jsfiddle.net/yehjiannrong/vveaL/


麻煩各位了
謝謝
本篇文章回覆於2013-12-25 20:27
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
9樓
作者回應

大家加油
檢舉此回應
測試網頁

修改一下 這樣大家比較好連結
只差最後一步了

其實各位也可以再提供關鍵字給我 不用提供語法
謝謝
本篇文章回覆於2013-12-25 20:28
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
10樓
作者回應

大家加油
檢舉此回應
搞定
if ($("input[@name='v8']:checked").val()=="費用1") {
// $("input[@name='v10']:checked").val()="費用3";
$("input[name='v10']")[0].checked=true;
}
else
$("input[name='v10']")[1].checked=true;

本篇文章回覆於2013-12-25 20:47
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
11樓
最有價值解答

KKBruce
捐贈 VP 給 KKBruce 檢舉此回應
我想,這裡是討論區,不是教學區。
先花時間學習,碰到問題再來討論,OK.
本篇文章回覆於2013-12-25 21:21
== 簽名檔 ==
--未登入的會員無法查看對方簽名檔--
   
1

回覆
如要回應,請先登入.