-
Notifications
You must be signed in to change notification settings - Fork 0
/
product.html
155 lines (139 loc) · 6.17 KB
/
product.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<!DOCTYPE html>
<!-- ricky_WEB -->
<html data-country="TW" data-test-group="1" lang="zh-TW">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <meta http-equiv="refresh" content="1" /> -->
<link rel="stylesheet" href="indexCSS.css">
<title>購物網</title>
</head>
<body>
<div id="container">
<div class="DIV1">
<!-- <dl>
<dd><input id="buttona" type="button" value="所有產品" onclick="Product(0)"></dd>
<li><input id="buttonb" type="button" value="ASUS" onclick="Product(1)"></li>
<li><input id="buttonc" type="button" value="ACER" onclick="Product(2)" ></li>
<li><input id="buttond" type="button" value="HP" onclick="Product(3)" ></li>
<li><input id="buttone" type="button" value="SONY" onclick="Product(4)" ></li>
</dl> -->
</div>
<div class="DIV2">
<div id="member_list">
<div>
<div class="subjectDiv">
<span class="heading"></span>產品詳細資料
</div>
<br><br><br><br>
<div style="float: left; margin-left:200px;">
<img id="product_Img" width="135" height="135" />
</div>
<div style="float: right; margin: 0 20%;">
<div class="albuminfo"><span class="smalltext">特價 </span><span class="redword"></span><span class="smalltext"> 元</span></div>
<div class="titleDiv"></div>
<div class="dataDiv" >
<p class="description">
<!-- ◆ Intel雙核心T2400<br />
◆ 80GBSATA大硬碟<br />
◆ NVIGF7400獨立顯示256MB<br />
◆ 15.4吋2.85KG -->
</p>
<hr width="100%" size="1" />
<form name="form1" method="get" action="cart.html">
<input name="id" type="hidden" id="id" value="">
<input name="name" type="hidden" id="name" value="">
<input name="price" type="hidden" id="price" value="">
<input name="qty" type="hidden" id="qty" value="1">
<input name="cartaction" type="hidden" id="cartaction" value="add">
<input name="button3" type="submit" id="button3" value="加入購物車">
<input type="button" name="button4" id="button4" value="回上一頁" onClick="window.history.back();">
</form>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<!-- <script>
let urlParams = new URLSearchParams(window.location.search);
if ( urlParams.get('id') > 0 && urlParams.get('id') != "" ) {
console.log(urlParams.get('id'));
// $("#productImage").attr("src", "images/2.png");
}else{
self.location.href="index.html";
}
$(function(){
$.ajax({
type: "GET",
url: "http://localhost/product.php",
dataType: "json",
success: show,
error: function(){alert("error!");}
});
});
(function ($) {
$.UrlParam = function (name) {
//宣告正規表達式
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
/*
* window.location.search 獲取URL ?之後的參數(包含問號)
* substr(1) 獲取第一個字以後的字串(就是去除掉?號)
* match(reg) 用正規表達式檢查是否符合要查詢的參數
*/
var r = window.location.search.substr(1).match(reg);
//如果取出的參數存在則取出參數的值否則回穿null
if (r != null) return unescape(r[2]); return null;
}
})(jQuery);
/*
*UrlParam取得網址參數需帶入參數名稱
*UrlParam(參數名稱)
*/
var param = $.UrlParam("id");
// alert(param);
function show(data){
all_ID=data;
var i=param -1;
$('.redword').after(all_ID[i].productprice);
$('.titleDiv').after(all_ID[i].productname);
var atStr=all_ID[i].description;
var dataAt=atStr.replace(/(\r\n)|(\n)/g,'<br>');
$('.description').after(dataAt);
$("#product_Img").attr("alt", all_ID[i].productname);
$("#product_Img").attr("src", "proimg/"+all_ID[i].productimages);
$("#id").attr("value", all_ID[i].productid);
$("#name").attr("value", all_ID[i].productname);
$("#price").attr("value", all_ID[i].productprice);
console.log(all_ID[i].description);
};
</script> -->
<script>
var getUrlString = location.href;
var url = new URL(getUrlString);
console.log(url.searchParams.get('id'));
$(document).ready(
$.get("product.php", function(data_json){
$data_array=JSON.parse(data_json);
var getUrlString = location.href;
var url = new URL(getUrlString);
for (var i = 0; i < $data_array.length; i++) {
if ($data_array[i].productid == url.searchParams.get('id')){
$('.redword').after($data_array[i].productprice);
$('.titleDiv').after($data_array[i].productname);
var atStr=$data_array[i].description;
var dataAt=atStr.replace(/(\r\n)|(\n)/g,'<br>');
$('.description').after(dataAt);
$("#product_Img").attr("alt", $data_array[i].productname);
$("#product_Img").attr("src", "proimg/"+$data_array[i].productimages);
$("#id").attr("value", $data_array[i].productid);
$("#name").attr("value", $data_array[i].productname);
$("#price").attr("value", $data_array[i].productprice);
break;
}
}
})
);
</script>
</html>