有没有办法在 HTML 中获取 SVG 选定部分的值,以将其与 PHP 一起使用




我是后端编程的新手,简而言之,我在一个questionare网站
工作 该项目的要求是在第一页是一个带有一个国家地图的SVG,然后基于所选城市,该值要传递给数据库,即地图中已选择的城市的值。

对于后端,我正在使用PHP,对于数据库(PDO(,我正在使用PHP,而对于数据库(PDO(,

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="./styling/citystyle.css">
<title>City</title>
</head>
<body>
<div class="hero">
<h1 class="qytetText">Where are you from?</h1>
<div class="map-container">
<!-- form -->
<form action="info.php" method="GET">
<svg xmlns:mapsvg="http://mapsvg.com" xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg" mapsvg:geoViewBox="20.047065 43.270767 21.814280 41.83369"
width="612.56158" height="696.99365">
<path
d="m 252.12271,318.5404 -0.14,-0.37 1.38,-3.59 0,-2.21 -2.2,-3.31 0.55,-3.87 2.48,-2.48 1.38,-5.52 1.66,-1.93 3.86,-1.11 3.87,-2.21 4.97,0.28 1.65,-3.31 -1.93,-4.14 -0.55,-2.76 1.38,-4.14 4.97,0 0.55,-3.04 2.76,-1.93 4.97,0 3.59,2.48 0.27,3.32 3.31,1.1 5.8,-4.14 0,-2.76 1.11,-4.42 5.24,-0.27 3.04,-0.83 3.86,-2.49 3.04,0 1.65,4.14 3.04,2.49 1.93,3.86 4.42,5.25 3.59,-0.28 6.35,-6.07 3.31,-3.59 4.41,-3.59 3.87,-2.21 3.31,-2.76 3.04,-1.65 -1.11,-4.97 0.83,-2.21 3.04,-0.55 1.1,-9.11 -2.21,-1.66 -2.2,-1.1 0.27,-3.04 4.97,-4.14 2.48,-3.03 3.59,-3.04 2.49,-0.55 0,-2.21 5.79,-0.28 1.11,-5.24 -1.38,-5.52 -3.31,-2.76 -2.49,-2.76 -3.59,-0.83 -0.83,-3.31 -0.55,-11.6 -3.03,-4.41 -0.83,-5.8 -2.21,-3.31 0,-6.07 3.86,-4.14 0.56,-8.56 2.76,-7.73 -0.28,-6.9 -6.07,-16.29 -2.21,-5.24 -2.48,-1.11 -4.15,-1.38 -1.93,-3.58 0.83,-4.97 -1.93,-1.66 -3.87,-1.38 -1.38,-6.24 -3.58,-4.41 0.55,-4.97 0,-2.21 1.65,-3.86 -2.48,-3.32 -1.66,-3.31 -2.2,0.55 -3.59,2.49 -3.32,-4.14 -1.93,-3.87 -0.65,-2.84 0,0 7.71,-2.55 2.19,-2.22 1.55,-1.14 1.04,-0.33 2.81,0.52 7.86,4.21 2.46,0.85 1.77,-0.33 8.38,-4.64 4.33,-2.83 1.45,-0.43 1.7,0.19 1.63,0.76 4.33,4.21 2.22,3.35 1.45,3.6 3.64,11.24 0.45,0.19 0.69,-0.19 5.02,-5.57 1.94,-0.95 1.6,-0.42 1.62,1.04 1.56,1.7 0.83,2.5 0.77,3.93 1,7.55 0.38,9.69 -0.07,8.07 -0.76,11.66 1.14,14.15 0.56,0.43 1,-0.43 5.79,-11.13 1.62,-1.46 1.84,-1.56 2.29,-0.66 3.01,0.42 3.01,1.89 1.77,1.7 5.06,15.05 -0.14,2.45 -4.71,12.16 -2.74,8.39 0.31,1.7 1.08,2.12 7.96,-1.08 7.55,-0.38 16.39,4.1 9.07,9 6.1,12.05 2.28,0.99 8.18,-3.58 2.53,3.58 -0.38,7.91 -0.49,4.42 -3.36,9.93 -6.44,9.31 -0.31,8.32 1.59,4.23 13.13,1.18 0.93,-0.1 1.25,0.29 9.91,0.51 4.22,3.86 10.75,4.01 0,0 0.36,4.33 -1.66,2.21 -0.55,2.21 -1.38,3.31 -4.14,1.38 0,3.87 -1.1,4.14 -4.42,0.27 -2.76,-1.1 -2.48,0 -1.11,-1.66 -2.48,-1.93 -2.76,-0.55 -2.49,2.76 -2.76,0.28 -1.1,1.65 2.76,3.04 3.03,2.76 0,3.31 3.59,1.66 3.04,0.55 1.93,3.31 4.14,1.11 1.38,3.58 -1.93,1.38 0.55,1.94 2.49,3.59 -3.32,1.38 -0.82,3.03 0,2.76 3.31,3.59 3.86,1.66 0,3.03 1.11,3.32 5.24,3.86 2.76,6.9 -5.24,1.93 -1.66,2.49 -4.14,-2.49 -2.48,-1.1 -3.04,1.93 -2.48,-3.31 -4.97,0 -2.49,3.31 -2.76,3.04 1.11,4.69 0,3.59 -4.42,2.48 -4.42,-0.83 -2.2,-1.38 -1.38,-1.93 -0.56,-2.48 -2.48,-0.83 -3.31,-0.55 -1.38,-2.49 -4.7,1.66 -4.41,2.21 -3.87,-1.38 -2.2,-2.76 -4.7,-0.28 -5.24,3.31 -1.93,2.21 -2.21,5.8 2.76,4.41 3.59,3.32 -2.49,3.59 0.55,4.69 0.83,1.65 4.69,2.21 -0.27,2.76 -2.49,6.63 -4.69,-0.28 -2.21,-1.1 -2.48,0 -1.38,2.21 1.93,3.58 -1.1,3.32 0.83,2.76 -0.81,2.42 0,0 -0.02,-0.05 0,0 -2.49,0.83 -1.38,2.76 -2.21,-0.28 -1.93,-4.41 -3.03,-2.76 -4.14,0.55 -3.59,-2.76 -6.9,0.27 -4.14,1.94 -2.76,0.55 -3.59,-1.11 -2.49,1.11 -3.58,2.76 -3.04,-0.28 -0.55,-3.59 -1.94,-3.58 -4.41,0 -6.35,-0.83 -1.66,-2.49 -2.21,-0.83 -10.21,4.7 -4.14,-1.66 -2.21,-1.38 -3.31,-0.27 -4.97,0.82 -5.52,-4.41 -1.1,3.03 -6.9,1.38 -1.38,-4.41 -2.21,-1.38 -3.87,-0.28 -2.76,1.66 -4.14,3.03 -1.1,3.04 -6.35,0.55 -3.84,0.77 0,0 -0.02,-0.22 0,0 -1.66,-4.69 -0.28,-3.04 -6.07,-1.93 -5.8,4.14 -2.76,-2.21 3.59,-4.69 -1.38,-3.03 -0.55,-2.76 5.52,-0.56 0.28,-6.62 -1.94,-0.83 -1.38,-4.14 -2.2,0.55 -2.49,6.07 -6.62,0 -2.49,2.21 -4.69,0.56 -5.24,5.52 -1.66,-3.59 0.28,-2.21 3.31,-3.87 1.1,-4.14 -0.55,-3.03 3.04,-2.76 0.55,-6.9 -4.97,-3.87 -1.38,-1.38 -1.93,-0.27 0,-2.76 4.14,-4.14 0.83,-4.97 -5.52,-3.04 -6.65,0.97 0,0 0.02,-0.25 z"
title="Pristina" id="XK-PR" onclick="addActive01()" value= "1" name="Prishtina"/>
<text x="60%" y="42.5%" stroke="#ffffff" stroke-width="1px" dy=".1em">Prishtina</text>
<path
d="m 320.34271,73.9104 0.65,2.84 1.93,3.87 3.32,4.14 3.59,-2.49 2.2,-0.55 1.66,3.31 2.48,3.32 -1.65,3.86 0,2.21 -0.55,4.97 3.58,4.41 1.38,6.24 3.87,1.38 1.93,1.66 -0.83,4.97 1.93,3.58 4.15,1.38 2.48,1.11 2.21,5.24 6.07,16.29 0.28,6.9 -2.76,7.73 -0.56,8.56 -3.86,4.14 0,6.07 2.21,3.31 0.83,5.8 3.03,4.41 0.55,11.6 0.83,3.31 3.59,0.83 2.49,2.76 3.31,2.76 1.38,5.52 -1.11,5.24 -5.79,0.28 0,2.21 -2.49,0.55 -3.59,3.04 -2.48,3.03 -4.97,4.14 -0.27,3.04 2.2,1.1 2.21,1.66 -1.1,9.11 -3.04,0.55 -0.83,2.21 1.11,4.97 -3.04,1.65 -3.31,2.76 -3.87,2.21 -4.41,3.59 -3.31,3.59 -6.35,6.07 -3.59,0.28 -4.42,-5.25 -1.93,-3.86 -3.04,-2.49 -1.65,-4.14 -3.04,0 -3.86,2.49 -3.04,0.83 -5.24,0.27 -1.11,4.42 0,2.76 -5.8,4.14 -3.31,-1.1 -0.27,-3.32 -3.59,-2.48 -4.97,0 -2.76,1.93 -0.55,3.04 -4.97,0 -1.38,4.14 0.55,2.76 1.93,4.14 -1.65,3.31 -4.97,-0.28 -3.87,2.21 -3.86,1.11 -1.66,1.93 -1.38,5.52 -2.48,2.48 -0.55,3.87 2.2,3.31 0,2.21 -1.38,3.59 0.14,0.37 0,0 -1.24,0.12 0,0 -3.31,1.66 -2.21,-0.83 -1.38,-7.45 -5.24,-3.86 -2.76,-1.11 -5.53,-0.55 -1.65,-8.28 6.07,-4.42 -1.66,-4.97 -2.76,-1.65 2.21,-2.49 -3.86,-2.76 -0.83,-1.65 -2.48,1.1 -0.83,3.87 -3.04,3.03 -5.52,0.28 -2.76,-3.31 -4.69,-8.01 -0.83,-4.42 -1.66,-1.38 -3.86,-1.1 -0.55,-3.31 1.93,-4.14 2.21,-0.83 1.38,0.55 3.59,-4.14 1.65,-4.69 0.28,-4.14 -4.14,-3.59 -1.38,-5.52 1.65,-3.87 2.76,-4.96 0,-8.01 1.66,-2.76 1.93,-4.14 0.55,-8.28 -7.45,0 0.28,-6.35 -3.04,-4.42 -3.03,-1.65 -1.11,-3.59 -3.03,-3.04 -5.8,-0.55 -1.38,-4.14 -4.14,1.1 -2.76,2.21 -4.14,1.11 -5.52,0.55 -4.14,1.1 -3.11,0 0,0 3.01,-6.34 0.24,-2.87 -10.29,-12.82 -1.9,-3.81 -1.15,-3.35 -0.62,-5.52 1.56,-4.33 2.39,-3.97 3.08,-2.78 2.36,-0.99 1.52,-1.04 4.05,-1.98 4.78,-4.38 3.22,-3.45 7.1,-3.68 10.74,-2.83 2.63,-1.98 2.5,0.52 3.01,1.65 2.81,2.64 1.66,0.19 0.48,-0.38 -0.62,-5.9 20.06,-2.92 1.31,-3.68 -0.38,-10.2 -4.12,-8.84 -1.35,-8.88 0.86,-4.82 -0.69,-6.9 -0.83,-0.61 -0.9,0 -3.36,1.51 -1.18,0.23 -1.28,-0.85 -1.35,-2.31 -1.49,-4.54 -0.1,-2.27 0.27,-1.61 1.91,-4.26 0.45,-1.7 0.1,-1.56 -0.45,-3.5 -1.11,-2.18 -1.66,-1.89 -12.05,-11.07 -2.5,-4.31 1.04,-3.13 16.59,-4.11 10.22,-4.88 5.09,-3.74 10.5,-6.68 2.42,-0.9 6.07,-1.57 1.83,-1.3199998 8.66,-7.97 2.91,-1.37 3.64,-0.38 9.11,0.28 9.14,5.79 4.4,7.3899998 9.91,17.95 4.08,6.11 0.42,1.89 -0.63,2.75 -0.55,1.13 -2.08,0.1 -10.18,-4.31 -2.56,-0.29 -3.4,1 -3.57,3.22 1.25,8.94 1.14,2.18 2.08,2.98 3.22,3.45 3.36,2.22 9.25,2.09 6.82,4.58 z"
title="Kosovska Mitrovica" id="XK-KM" onclick="addActive02()" value= "2" name="Mitrovica"/>
<text x="40%" y="25%" stroke="#ffffff" stroke-width="1px" dy=".1em">Mitrovica</text>
<path
d="m 153.88271,482.8004 -1.33,-1.77 -3.4,-2.19 -0.2,-1.82 -0.52,-1.26 -3.16,-2.42 -2.49,-3.08 -3.95,-1.35 -2.25,-1.35 -5.06,-0.47 -0.31,-0.23 -0.62,-1.78 -2.29,-0.09 -2.14,-0.79 -1.84,-0.28 -1.8,-2.1 -1.28,-3.41 -0.66,-0.65 -1.32,-0.33 -3.84,-2.24 -1.56,-0.65 -2.81,-0.33 -2.46,-1.44 -2.14,-0.1 -0.14,-0.23 0.48,-3.03 -1.42,-1.54 -1.45,-2.24 -1.66,-0.66 -1.32,-0.98 -4.089996,0.14 -0.59,0.47 -1.45,2.01 -2.56,0.84 -1.98,2.33 -0.93,-0.23 -0.7,-0.8 -2.49,-1.3 -1.52,-1.73 -1.11,0.09 -4.47,1.45 -5.82,0.94 -0.35,-0.24 -0.83,-1.58 -2.42,-0.24 -1.46,-1.21 -0.24,-1.12 1.32,-1.78 -0.11,-1.58 -0.76,-1.96 -2.35,-2.76 -0.35,-1.26 1.07,-1.31 0.77,-0.46 0.58,0 0.21,-0.38 0.56,-4.06 -0.11,-3.64 -1.66,-1.87 0.31,-1.36 -0.52,-1.68 -1.21,-0.61 -1.07,-1.63 -4.09,-3.74 -3.92,-2.71 -0.52,-1.03 2.19,-4.48 2.66,-1.55 0.87,-0.79 0.55,-0.98 -0.27,-3.18 -0.94,-1.26 -1.21,-3.84 -0.66,-0.75 -2.11,-1.03 -2.05,-3.22 -4.12,-2.67 -0.48,-0.56 -0.18,-1.92 0.46,-0.79 1.14,-1.12 0.28,-1.17 -2.39,-3.33 -2.15,-1.21 -0.59,-0.89 -0.87,-3.46 -0.24,-2.16 -3.46,-3.46 -0.8,-1.08 -0.14,-0.93 0.42,-2.06 -0.18,-1.03 -0.45,-0.75 -3.18,-1.69 -0.7,-1.26 -0.55,-0.42 -4.92,-1.92 -2.01,-1.17 -3.53,-1.22 -0.38,-0.47 -0.24,-1.64 -2.67,0 -4.33,-2.43 -0.8,-0.7 -1.28,-3.28 -1.94,-2.16 -0.52,-2.34 -2.73,-1.78 -2.1199998,-0.28 4.8899998,-12.32 0.38,-2.91 -0.38,-2.53 -1.73,-4.69 -0.35,-4.59 0.69,-3.29 1.91,-2.86 1.66,-1.55 4.05,-2.15 4.47,-5.07 3.12,-4.51 1.45,-1.66 0,0 5.96,4.34 7.45,0.27 5.52,2.21 6.35,0 3.31,1.1 -2.48,3.59 -2.76,3.32 0.83,3.58 2.76,0.83 4.14,6.9 2.48,0.83 5.52,-0.55 4.69,3.31 11.87,4.42 2.76,0.55 2.49,-0.55 4.41,-2.49 1.38,-3.58 3.04,0.55 2.209996,2.76 2.21,1.1 2.48,2.76 2.21,3.31 -3.31,1.38 1.38,2.76 2.21,2.49 3.86,0.55 0.83,2.49 -2.49,2.48 -1.38,1.93 3.04,2.21 11.04,-0.55 3.59,-1.93 2.76,-1.94 5.52,1.38 2.48,1.11 5.8,0 6.63,-3.04 7.17,1.11 2.76,3.03 3.04,1.38 5.24,-1.93 1.94,0.28 2.2,2.76 -1.65,3.86 2.21,2.76 0,3.04 3.86,6.07 2.76,-1.1 0,0 3.04,-0.28 0,0 3.59,1.93 2.2,6.07 2.49,1.66 5.52,0.28 1.38,4.69 0.28,5.52 3.31,0.55 10.21,0 5.25,0.83 3.31,3.31 3.59,1.66 0.82,3.31 6.08,1.11 1.65,0.82 -1.1,5.8 2.76,2.48 3.31,0.28 1.38,2.48 -4.14,4.14 2.76,3.04 3.04,3.87 -0.28,4.69 -1.1,6.07 1.93,6.07 -2.76,2.76 0.55,1.94 0.55,5.24 -3.03,1.93 -1.66,4.14 0,3.32 -3.86,3.31 -2.49,-0.83 -1.38,-3.31 -0.55,-2.76 -2.21,-3.59 -4.97,0 -2.2,2.21 -1.66,4.69 -1.66,2.76 -2.48,3.04 -1.93,1.38 -0.83,3.58 -3.04,-1.65 -3.31,0 0,-4.42 -3.59,-0.55 -4.69,0 -3.87,1.1 -1.1,2.76 -1.66,2.21 -1.1,-3.31 -2.21,-2.76 -0.55,2.48 -0.83,6.9 -5.52,1.11 -1.38,2.21 -3.04,3.59 -6.07,1.38 -0.27,4.14 -3.59,2.2 -6.9,1.38 z"
title="Đakovica" id="XK-DA" onclick="addActive03()" value= "3" name="Gjakove"/>
<text x="17%" y="58%" stroke="#ffffff" stroke-width="1px" dy=".1em">Gjakovë</text>
<path
d="m 425.63271,387.2804 0.81,-2.42 -0.83,-2.76 1.1,-3.32 -1.93,-3.58 1.38,-2.21 2.48,0 2.21,1.1 4.69,0.28 2.49,-6.63 0.27,-2.76 -4.69,-2.21 -0.83,-1.65 -0.55,-4.69 2.49,-3.59 -3.59,-3.32 -2.76,-4.41 2.21,-5.8 1.93,-2.21 5.24,-3.31 4.7,0.28 2.2,2.76 3.87,1.38 4.41,-2.21 4.7,-1.66 1.38,2.49 3.31,0.55 2.48,0.83 0.56,2.48 1.38,1.93 2.2,1.38 4.42,0.83 4.42,-2.48 0,-3.59 -1.11,-4.69 2.76,-3.04 2.49,-3.31 4.97,0 2.48,3.31 3.04,-1.93 2.48,1.1 4.14,2.49 1.66,-2.49 5.24,-1.93 -2.76,-6.9 -5.24,-3.86 -1.11,-3.32 0,-3.03 -3.86,-1.66 -3.31,-3.59 0,-2.76 0.82,-3.03 3.32,-1.38 -2.49,-3.59 -0.55,-1.94 1.93,-1.38 -1.38,-3.58 -4.14,-1.11 -1.93,-3.31 -3.04,-0.55 -3.59,-1.66 0,-3.31 -3.03,-2.76 -2.76,-3.04 1.1,-1.65 2.76,-0.28 2.49,-2.76 2.76,0.55 2.48,1.93 1.11,1.66 2.48,0 2.76,1.1 4.42,-0.27 1.1,-4.14 0,-3.87 4.14,-1.38 1.38,-3.31 0.55,-2.21 1.66,-2.21 -0.36,-4.33 0,0 0.54,0.22 17.29,-0.33 13.5,3.24 11.33,7.33 13.3,23.38 8.49,7.28 7.1,-2.91 2.42,-4.51 9.11,-9.76 1.66,-1.18 1.39,-0.56 2.25,-0.38 3.36,0.57 2.7,1.59 5.51,3.99 2.25,2.87 1.15,4.46 -0.39,6.05 0.73,5.35 2.81,4.22 2.11,3.89 -2.87,2.86 -10.88,5.02 -9.11,15.8 -2.25,16.49 -4.68,14.23 -6.72,7.96 -17.84,9.03 -9.9,9.12 -2.5,7.35 2.81,6.31 -3.71,17.62 -10.32,7.47 -5.4,9.99 -0.62,8.87 3.74,8.12 6.75,3.27 0.04,5.04 -1.42,3.78 1.03,11.61 -24.48,2.1 -8.49,1.96 -2.36,-0.28 -2.77,-2.15 -7.2,-3.91 -3.4,-0.38 -5.12,0.38 -1.32,0.28 -1.11,1.21 -0.2,4.01 -0.42,1.49 -1.11,2.05 -3.05,2.33 -12.12,0.75 -3.71,1.44 -1.09,0.95 0,0 -1.44,-1.44 -1.66,-3.59 -3.86,-1.93 -4.7,1.38 -2.48,-0.28 -2.21,-3.86 -3.31,-0.83 -3.87,1.93 -1.93,-3.04 -2.21,0 -1.38,-3.03 -5.52,-9.39 -2.76,-0.55 -0.55,-7.45 1.93,-2.76 0.55,-3.59 3.59,-0.28 0.56,-4.14 0.82,-2.76 0.28,-2.48 -8.01,1.93 -2.48,-3.86 -4.42,-0.56 1.66,-3.86 0,-4.14 1.93,-1.66 3.59,0 1.93,-3.03 2.76,-1.38 3.04,-0.28 4.69,3.86 0,-3.31 2.49,-2.48 -2.49,-3.31 -3.59,-3.32 0.83,-3.86 1.38,-3.31 1.66,-6.63 -6.63,-4.97 -1.38,-4.41 0,0 z"
title="Gnjilane" id="XK-GN" onclick="addActive04()" value= "4" name="Gjilan" />
<text x="78%" y="54%" stroke="#ffffff" stroke-width="1px" dy=".1em">Gjilan</text>
<path
d="m 180.78271,360.4904 -0.84,0.08 0,0 -2.76,1.1 -3.86,-6.07 0,-3.04 -2.21,-2.76 1.65,-3.86 -2.2,-2.76 -1.94,-0.28 -5.24,1.93 -3.04,-1.38 -2.76,-3.03 -7.17,-1.11 -6.63,3.04 -5.8,0 -2.48,-1.11 -5.52,-1.38 -2.76,1.94 -3.59,1.93 -11.04,0.55 -3.04,-2.21 1.38,-1.93 2.49,-2.48 -0.83,-2.49 -3.86,-0.55 -2.21,-2.49 -1.38,-2.76 3.31,-1.38 -2.21,-3.31 -2.48,-2.76 -2.21,-1.1 -2.209996,-2.76 -3.04,-0.55 -1.38,3.58 -4.41,2.49 -2.49,0.55 -2.76,-0.55 -11.87,-4.42 -4.69,-3.31 -5.52,0.55 -2.48,-0.83 -4.14,-6.9 -2.76,-0.83 -0.83,-3.58 2.76,-3.32 2.48,-3.59 -3.31,-1.1 -6.35,0 -5.52,-2.21 -7.45,-0.27 -5.96,-4.34 0,0 2.7,-3.5 -0.27,-1.26 -3.54,-2.3 -2.25,-2.12 -1.18,-1.55 -2.45,-4.6 -2.12,-3.05 -2.77,-1.55 -2.11,-0.09 -1.8,-0.52 -1.11,-0.84 -1.35,-2.12 -1.4899998,-1.31 -3.29,-1.04 -0.73,-0.75 -1.07,-2.72 -0.66,-0.94 -2.15,-7.61 -1.37999999,-2.54 -0.35,-1.41 0.1,-1.13 1.62999999,-2.3 1.39,-1.46 1.45,-2.21 0.52,-1.27 0.35,-1.83 0.07,-1.88 1.04,-2.35 0.62,-0.47 0.93,-0.47 1.18,0.14 4.3299998,1.74 2.43,0.47 1.17,0.8 2.22,0.37 3.5,1.41 3.98,1.98 3.92,0.61 3.15,1.74 3.6,1.22 3.19,0.71 2.6,-0.47 4.43,0.37 7.93,-0.04 5.47,0.56 4.78,1.74 4.06,0.05 3.63,-1.7 8.42,-11.84 1.21,-1.08 2.25,-2.73 0.14,-0.89 -0.38,-1.18 -1.7,-3.06 -0.86,-3.57 0.21,-1.32 0.65,-1.08 3.54,-3.53 4.53,-2.45 2.15,-0.84 1.39,-1.27 1.8,-2.26 1.45,-1.18 1.529996,-0.38 5.54,1.56 2.28,0.23 0.87,0.43 3.08,0.23 11.23,-2.02 24.62,-5.13 1.01,0.04 9.97,-1.55 0.8,-0.66 2.94,-1.32 1.8,-1.27 3.06,-4.96 0,0 3.11,0 4.14,-1.1 5.52,-0.55 4.14,-1.11 2.76,-2.21 4.14,-1.1 1.38,4.14 5.8,0.55 3.03,3.04 1.11,3.59 3.03,1.65 3.04,4.42 -0.28,6.35 7.45,0 -0.55,8.28 -1.93,4.14 -1.66,2.76 0,8.01 -2.76,4.96 -1.65,3.87 1.38,5.52 4.14,3.59 -0.28,4.14 -1.65,4.69 -3.59,4.14 -1.38,-0.55 -2.21,0.83 -1.93,4.14 0.55,3.31 3.86,1.1 1.66,1.38 0.83,4.42 4.69,8.01 2.76,3.31 5.52,-0.28 3.04,-3.03 0.83,-3.87 2.48,-1.1 0.83,1.65 3.86,2.76 -2.21,2.49 2.76,1.65 1.66,4.97 -6.07,4.42 1.65,8.28 5.53,0.55 2.76,1.11 5.24,3.86 1.38,7.45 2.21,0.83 3.31,-1.66 0,0 2.76,-0.27 -0.28,4.14 0,0 -2.2,3.31 -0.56,3.59 -7.72,0 -3.32,-0.55 -2.21,-2.76 -8.55,3.86 -4.42,8.01 -1.93,2.76 -0.55,5.24 -1.93,1.93 -1.39,3.04 -3.31,1.66 0.28,3.58 -4.97,-0.27 -5.52,0.83 -4.97,2.2 -7.45,-1.65 -4.42,0 -5.52,0.83 z"
title="Peć" id="XK-PE" onclick="addActive05()" value= "5" name="Peje"/>
<text x="22%" y="41%" stroke="#ffffff" stroke-width="1px" dy=".1em">Pejë</text>
<path
d="m 460.45271,488.3204 -1.99,1.71 -3.22,4.38 -4.85,5.5 -7.76,13.92 -8.45,26.44 -4.05,5.21 -2.22,2.19 -2.73,0.79 -4.16,0.7 -3.08,-1.86 -3.47,-0.38 -3.11,1.17 -2.22,0.32 -1.18,-0.23 -1.38,-1.26 -0.97,-2.13 -0.42,-3.08 -1.18,-3.81 -4.22,-7.54 -9.25,-9.36 -1.39,-5.07 -0.69,-6.71 -1.59,-3.49 -2.6,-3.07 -1.56,-1.4 -2.15,-0.98 -2.21,-0.09 -6.83,-1.12 -1.8,0.47 -1.45,1.21 -2.64,2.98 -9.14,5.12 -2.91,5.22 -2.35,2.6 -6.86,5.13 -2.36,0.83 -2.91,0.66 -3.6,2.32 -4.29,3.38 0,0 -2.76,-7.33 -3.32,-7.18 -3.03,-3.31 -6.08,-1.11 -4.69,-3.31 -11.04,0.28 -8.56,-1.38 -3.59,-1.38 -0.55,-4.42 2.49,-0.83 2.21,-3.03 -0.56,-2.76 -1.1,-1.94 0.27,-2.76 3.59,-1.65 6.35,3.58 2.76,-3.03 1.38,-3.04 3.59,-2.76 4.14,-1.1 1.93,-5.25 0.56,-3.86 3.31,-0.83 2.76,2.76 2.76,-3.31 4.42,-0.83 1.93,-0.83 -2.49,-2.76 -1.65,-5.52 3.03,-1.93 0.83,-2.76 -2.21,-3.04 0,-3.31 -2.76,-0.55 0,-4.42 2.21,-2.76 0.55,-2.76 -3.31,-2.48 0,-4.97 -2.76,-3.59 -4.14,-3.86 -4.97,0 -2.48,-1.94 -0.28,-3.03 3.59,-1.66 5.52,2.76 1.66,-3.31 -2.21,-2.49 -2.49,-0.82 -1.93,-2.21 0,-2.76 3.59,-0.28 1.1,-4.14 4.14,-0.27 1.11,-1.66 -3.04,-2.76 -2.21,-1.1 -2.2,-3.32 0.55,-3.86 -3.04,-1.11 -4.14,-0.55 -4.42,-1.1 -1.65,-1.66 -3.59,0 -0.55,-1.93 0,0 -0.53,-4.2 0,0 3.84,-0.77 6.35,-0.55 1.1,-3.04 4.14,-3.03 2.76,-1.66 3.87,0.28 2.21,1.38 1.38,4.41 6.9,-1.38 1.1,-3.03 5.52,4.41 4.97,-0.82 3.31,0.27 2.21,1.38 4.14,1.66 10.21,-4.7 2.21,0.83 1.66,2.49 6.35,0.83 4.41,0 1.94,3.58 0.55,3.59 3.04,0.28 3.58,-2.76 2.49,-1.11 3.59,1.11 2.76,-0.55 4.14,-1.94 6.9,-0.27 3.59,2.76 4.14,-0.55 3.03,2.76 1.93,4.41 2.21,0.28 1.38,-2.76 2.49,-0.83 0,0 1.65,4.42 0,0 1.38,4.41 6.63,4.97 -1.66,6.63 -1.38,3.31 -0.83,3.86 3.59,3.32 2.49,3.31 -2.49,2.48 0,3.31 -4.69,-3.86 -3.04,0.28 -2.76,1.38 -1.93,3.03 -3.59,0 -1.93,1.66 0,4.14 -1.66,3.86 4.42,0.56 2.48,3.86 8.01,-1.93 -0.28,2.48 -0.82,2.76 -0.56,4.14 -3.59,0.28 -0.55,3.59 -1.93,2.76 0.55,7.45 2.76,0.55 5.52,9.39 1.38,3.03 2.21,0 1.93,3.04 3.87,-1.93 3.31,0.83 2.21,3.86 2.48,0.28 4.7,-1.38 3.86,1.93 1.66,3.59 z"
title="Uroševac" id="XK-UR" onclick="addActive06()" value= "6" name="Feriza"/>
<text x="57%" y="63%" stroke="#ffffff" stroke-width="1px" dy=".1em">Ferizaj</text>
<path
d="m 331.21271,528.9904 -4.71,3.56 -2.29,0.56 -7.07,0.79 -6.13,2.7 -3.63,3.39 -6.38,8.28 -2.35,2.52 -1.87,1.16 -1.15,0.32 -4.78,0.14 -5.26,-0.55 -1.07,0.18 -2.6,1.21 -1.94,1.63 -3.02,1.62 -5.29,1.35 -6.79,0.42 -1.11,0.28 -1.21,0.74 -1.39,1.31 -1.14,2.32 -2.53,2.7 -9.39,15.15 -1.04,2.32 -0.17,1.02 0.66,6.23 -0.18,5.71 0.63,9.8 0.76,2.55 3.19,5.01 0.62,3.11 -0.07,1.62 -1,3.39 -0.25,2.79 0.14,1.81 0.42,1.48 0.9,1.62 3.74,5.2 0.1,1.39 -12.26,11.96 -2.49,4.08 -1.21,1.39 -12.09,7.78 -5.61,2.78 -5.16,3.43 -1.7,2.13 -0.83,4.4 -0.38,0.84 -6.27,8.38 -1.7,1.85 -0.83,1.34 -1.8,5.65 -1.91,1.9 -2.87,2.17 -1.25,0.65 -2.49,-0.55 -2.32,-1.44 -0.49,-0.05 -3.43,1.95 -1.38,0.28 -3.95,-0.51 -1.53,-0.79 -0.41,-0.6 0.28,-3.7 -0.28,-1.21 -1.28,-2.77 -2.74,-9.54 0.52,-2.64 -0.35,-2.36 0.7,-2.51 0.17,-1.66 -1.18,-6.21 0.07,-4.36 0.56,-1.06 1.8,-0.33 1.35,-1.71 0.69,-0.42 6.75,-0.6 0.45,-0.28 -0.13,-3.38 -1.77,-2.74 -4.19,-11.73 2.39,-0.88 0.83,-0.55 1.52,-2.93 0.87,-1.02 3.39,-1.53 4.33,-3.01 1.56,-1.44 1.01,-6.26 0.97,-2.23 0.31,-1.35 -0.66,-4.5 0,-2.04 -0.94,-1.26 -1.97,-1.57 -1.49,-3.21 -1.94,-6.87 -1.35,-5.9 -1.11,-1.02 -0.62,-1.3 -0.97,-9.89 -5.82,-6.84 -1.04,-0.88 -1.42,-0.32 -4.47,-9.4 -0.97,-1.11 0.11,-1.12 3.63,-6.04 0,-0.65 -0.76,-1.07 -0.76,-1.82 -0.1,-1.3 0.2,-1.16 1.91,-3.91 0.1,-0.7 -0.14,-1.16 -3.84,-7.87 -0.07,-1.11 0.69,-1.07 0.04,-0.75 -2.5,-2.79 -2.66,-3.77 -0.04,-0.37 0.76,-0.98 -0.03,-0.47 -0.9,-2 -0.35,-1.44 -1.76,-2.94 -1.53,-3.44 -1.7,-9.13 -1.07,-3.54 -1.94,-1.96 -1.07,-1.77 -5.09,-4.57 -0.07,-1.81 -0.66,-2.66 -0.83,-1.03 -1.72,-1.12 0,0 2.05,-3.27 6.9,-1.38 3.59,-2.2 0.27,-4.14 6.07,-1.38 3.04,-3.59 1.38,-2.21 5.52,-1.11 0.83,-6.9 0.55,-2.48 2.21,2.76 1.1,3.31 1.66,-2.21 1.1,-2.76 3.87,-1.1 4.69,0 3.59,0.55 0,4.42 3.31,0 3.04,1.65 0.83,-3.58 1.93,-1.38 2.48,-3.04 1.66,-2.76 1.66,-4.69 2.2,-2.21 4.97,0 2.21,3.59 0.55,2.76 1.38,3.31 2.49,0.83 3.86,-3.31 0,-3.32 1.66,-4.14 3.03,-1.93 -0.55,-5.24 -0.55,-1.94 2.76,-2.76 -1.93,-6.07 1.1,-6.07 0.28,-4.69 -3.04,-3.87 -2.76,-3.04 4.14,-4.14 -1.38,-2.48 -3.31,-0.28 -2.76,-2.48 1.1,-5.8 -1.65,-0.82 -6.08,-1.11 -0.82,-3.31 -3.59,-1.66 -3.31,-3.31 -5.25,-0.83 -10.21,0 -3.31,-0.55 -0.28,-5.52 -1.38,-4.69 -5.52,-0.28 -2.49,-1.66 -2.2,-6.07 -3.59,-1.93 0,0 -2.2,0.2 0,0 1.92,-2.35 5.52,-0.83 4.42,0 7.45,1.65 4.97,-2.2 5.52,-0.83 4.97,0.27 -0.28,-3.58 3.31,-1.66 1.39,-3.04 1.93,-1.93 0.55,-5.24 1.93,-2.76 4.42,-8.01 8.55,-3.86 2.21,2.76 3.32,0.55 7.72,0 0.56,-3.59 2.2,-3.31 0,0 0.26,-3.89 0,0 6.65,-0.97 5.52,3.04 -0.83,4.97 -4.14,4.14 0,2.76 1.93,0.27 1.38,1.38 4.97,3.87 -0.55,6.9 -3.04,2.76 0.55,3.03 -1.1,4.14 -3.31,3.87 -0.28,2.21 1.66,3.59 5.24,-5.52 4.69,-0.56 2.49,-2.21 6.62,0 2.49,-6.07 2.2,-0.55 1.38,4.14 1.94,0.83 -0.28,6.62 -5.52,0.56 0.55,2.76 1.38,3.03 -3.59,4.69 2.76,2.21 5.8,-4.14 6.07,1.93 0.28,3.04 1.66,4.69 0,0 0.55,4.42 0,0 0.55,1.93 3.59,0 1.65,1.66 4.42,1.1 4.14,0.55 3.04,1.11 -0.55,3.86 2.2,3.32 2.21,1.1 3.04,2.76 -1.11,1.66 -4.14,0.27 -1.1,4.14 -3.59,0.28 0,2.76 1.93,2.21 2.49,0.82 2.21,2.49 -1.66,3.31 -5.52,-2.76 -3.59,1.66 0.28,3.03 2.48,1.94 4.97,0 4.14,3.86 2.76,3.59 0,4.97 3.31,2.48 -0.55,2.76 -2.21,2.76 0,4.42 2.76,0.55 0,3.31 2.21,3.04 -0.83,2.76 -3.03,1.93 1.65,5.52 2.49,2.76 -1.93,0.83 -4.42,0.83 -2.76,3.31 -2.76,-2.76 -3.31,0.83 -0.56,3.86 -1.93,5.25 -4.14,1.1 -3.59,2.76 -1.38,3.04 -2.76,3.03 -6.35,-3.58 -3.59,1.65 -0.27,2.76 1.1,1.94 0.56,2.76 -2.21,3.03 -2.49,0.83 0.55,4.42 3.59,1.38 8.56,1.38 11.04,-0.28 4.69,3.31 6.08,1.11 3.03,3.31 3.32,7.18 z"
title="Prizren" id="XK-PZ" onclick="addActive07()" value= "7" name="Prizren"/>
<text x="36%" y="70%" stroke="#ffffff" stroke-width="1px" dy=".1em">Prizren</text>
</svg>
</div>
</form>
<!-- end of form -->
</div>
</body>
<script>
function addActive01() {
document.getElementById("XK-PR").classList.add('active');
document.getElementById("XK-KM").classList.remove("active");
document.getElementById("XK-DA").classList.remove("active");
document.getElementById("XK-GN").classList.remove("active");
document.getElementById("XK-PE").classList.remove("active");
document.getElementById("XK-UR").classList.remove("active");
document.getElementById("XK-PZ").classList.remove("active");
var qytet = document.getElementById("XK-PR");
var emriQytetit = qytet.getAttribute('value');
window.location.href='./info.php'
}
function addActive02() {
document.getElementById("XK-KM").classList.add('active');
document.getElementById("XK-PR").classList.remove("active");
document.getElementById("XK-DA").classList.remove("active");
document.getElementById("XK-GN").classList.remove("active");
document.getElementById("XK-PE").classList.remove("active");
document.getElementById("XK-UR").classList.remove("active");
document.getElementById("XK-PZ").classList.remove("active");
var qytet = document.getElementById("XK-KM");
var emriQytetit = qytet.getAttribute('value');

window.location='./info.php'
}
function addActive03() {
document.getElementById("XK-DA").classList.add('active');
document.getElementById("XK-PR").classList.remove("active");
document.getElementById("XK-KM").classList.remove("active");
document.getElementById("XK-GN").classList.remove("active");
document.getElementById("XK-PE").classList.remove("active");
document.getElementById("XK-UR").classList.remove("active");
document.getElementById("XK-PZ").classList.remove("active");
var qytet = document.getElementById("XK-DA");
var emriQytetit = qytet.getAttribute('value');
window.location='./info.php'
}
function addActive04() {
document.getElementById("XK-GN").classList.add('active');
document.getElementById("XK-PR").classList.remove("active");
document.getElementById("XK-KM").classList.remove("active");
document.getElementById("XK-DA").classList.remove("active");
document.getElementById("XK-PE").classList.remove("active");
document.getElementById("XK-UR").classList.remove("active");
document.getElementById("XK-PZ").classList.remove("active");
var qytet = document.getElementById("XK-GN");
var emriQytetit = qytet.getAttribute('value');
window.location='./info.php'
}
function addActive05() {
document.getElementById("XK-PE").classList.add('active');
document.getElementById("XK-PR").classList.remove("active");
document.getElementById("XK-KM").classList.remove("active");
document.getElementById("XK-DA").classList.remove("active");
document.getElementById("XK-GN").classList.remove("active");
document.getElementById("XK-UR").classList.remove("active");
document.getElementById("XK-PZ").classList.remove("active");
var qytet = document.getElementById("XK-PE");
var emriQytetit = qytet.getAttribute('value');
window.location='./info.php'
}
function addActive06() {
document.getElementById("XK-UR").classList.add('active');
document.getElementById("XK-PR").classList.remove("active");
document.getElementById("XK-KM").classList.remove("active");
document.getElementById("XK-DA").classList.remove("active");
document.getElementById("XK-GN").classList.remove("active");
document.getElementById("XK-PE").classList.remove("active");
document.getElementById("XK-PZ").classList.remove("active");
var qytet = document.getElementById("XK-UR");
var emriQytetit = qytet.getAttribute('value');
window.location='./info.php'
}
function addActive07() {
document.getElementById("XK-PZ").classList.add('active');
document.getElementById("XK-PR").classList.remove("active");
document.getElementById("XK-KM").classList.remove("active");
document.getElementById("XK-DA").classList.remove("active");
document.getElementById("XK-GN").classList.remove("active");
document.getElementById("XK-PE").classList.remove("active");
document.getElementById("XK-UR").classList.remove("active");
var qytet = document.getElementById("XK-PZ");
var emriQytetit = qytet.getAttribute('value');
window.location='./info.php'
}
</script>
</html>
<!-- onclick="window.location='./info.php'" -->

我尝试用 js 获取值,然后尝试用 $_POST 将其传递给 php,但它不起作用, 所以如果你们有任何提示,我将不胜感激
谢谢,如果我不清楚,我很抱歉,但我也是 StackOverFlow
的新手

首先,不需要所有这些JS函数。创建这样的单个函数。

function addActive(sender, value){
let paths = document.getElementsByTagName('path');
for(let i=0; i < paths.length; i++){
paths[i].classList.remove("active");
} 
sender.classList.add('active');
window.location='./info.php?v=' + value;
}

然后像这样使用函数,

onclick="addActive(this, 1)"

其中 1 是值。

该函数将首先通过删除活动类来停用所有路径,然后它将为所选路径添加活动类。

请注意,我尚未测试此代码,因此您可能需要进行一些更改。这也是一个 GET 请求。

我不确定你想做什么传递给PHP到底是什么,或者如何传递,但是


function addActive02() {
console.log(document.getElementById("XK-KM"));

在浏览器的控制台中,我确实看到

<path d="m 320.34271,73.9104 0.65,2.84 1.93,3.87 3.32,4.14 3.59,-2.49 2.2,-0.55 1.66,3.31 2.48,3.32 -1.65,3.86 0,2.21 -0.55,4.97 3.58,4.41 1.38,6.24 3.87,1.38 1.93,1.66 -0.83,4.97 1.93,3.58 4.15,1.38 2.48,1.11 2.21,5.24 6.07,16.29 0.28,6.9 -2.76,7.73 -0.56,8.56 -3.86,4.14 0,6.07 2.21,3.31 0.83,5.8 3.03,4.41 0.55,11.6 0.83,3.31 3.59,0.83 2.49,2.76 3.31,2.76 1.38,5.52 -1.11,5.24 -5.79,0.28 0,2.21 -2.49,0.55 -3.59,3.04 -2.48,3.03 -4.97,4.14 -0.27,3.04 2.2,1.1 2.21,1.66 -1.1,9.11 -3.04,0.55 -0.83,2.21 1.11,4.97 -3.04,1.65 -3.31,2.76 -3.87,2.21 -4.41,3.59 -3.31,3.59 -6.35,6.07 -3.59,0.28 -4.42,-5.25 -1.93,-3.86 -3.04,-2.49 -1.65,-4.14 -3.04,0 -3.86,2.49 -3.04,0.83 -5.24,0.27 -1.11,4.42 0,2.76 -5.8,4.14 -3.31,-1.1 -0.27,-3.32 -3.59,-2.48 -4.97,0 -2.76,1.93 -0.55,3.04 -4.97,0 -1.38,4.14 0.55,2.76 1.93,4.14 -1.65,3.31 -4.97,-0.28 -3.87,2.21 -3.86,1.11 -1.66,1.93 -1.38,5.52 -2.48,2.48 -0.55,3.87 2.2,3.31 0,2.21 -1.38,3.59 0.14,0.37 0,0 -1.24,0.12 0,0 -3.31,1.66 -2.21,-0.83 -1.38,-7.45 -5.24,-3.86 -2.76,-1.11 -5.53,-0.55 -1.65,-8.28 6.07,-4.42 -1.66,-4.97 -2.76,-1.65 2.21,-2.49 -3.86,-2.76 -0.83,-1.65 -2.48,1.1 -0.83,3.87 -3.04,3.03 -5.52,0.28 -2.76,-3.31 -4.69,-8.01 -0.83,-4.42 -1.66,-1.38 -3.86,-1.1 -0.55,-3.31 1.93,-4.14 2.21,-0.83 1.38,0.55 3.59,-4.14 1.65,-4.69 0.28,-4.14 -4.14,-3.59 -1.38,-5.52 1.65,-3.87 2.76,-4.96 0,-8.01 1.66,-2.76 1.93,-4.14 0.55,-8.28 -7.45,0 0.28,-6.35 -3.04,-4.42 -3.03,-1.65 -1.11,-3.59 -3.03,-3.04 -5.8,-0.55 -1.38,-4.14 -4.14,1.1 -2.76,2.21 -4.14,1.11 -5.52,0.55 -4.14,1.1 -3.11,0 0,0 3.01,-6.34 0.24,-2.87 -10.29,-12.82 -1.9,-3.81 -1.15,-3.35 -0.62,-5.52 1.56,-4.33 2.39,-3.97 3.08,-2.78 2.36,-0.99 1.52,-1.04 4.05,-1.98 4.78,-4.38 3.22,-3.45 7.1,-3.68 10.74,-2.83 2.63,-1.98 2.5,0.52 3.01,1.65 2.81,2.64 1.66,0.19 0.48,-0.38 -0.62,-5.9 20.06,-2.92 1.31,-3.68 -0.38,-10.2 -4.12,-8.84 -1.35,-8.88 0.86,-4.82 -0.69,-6.9 -0.83,-0.61 -0.9,0 -3.36,1.51 -1.18,0.23 -1.28,-0.85 -1.35,-2.31 -1.49,-4.54 -0.1,-2.27 0.27,-1.61 1.91,-4.26 0.45,-1.7 0.1,-1.56 -0.45,-3.5 -1.11,-2.18 -1.66,-1.89 -12.05,-11.07 -2.5,-4.31 1.04,-3.13 16.59,-4.11 10.22,-4.88 5.09,-3.74 10.5,-6.68 2.42,-0.9 6.07,-1.57 1.83,-1.3199998 8.66,-7.97 2.91,-1.37 3.64,-0.38 9.11,0.28 9.14,5.79 4.4,7.3899998 9.91,17.95 4.08,6.11 0.42,1.89 -0.63,2.75 -0.55,1.13 -2.08,0.1 -10.18,-4.31 -2.56,-0.29 -3.4,1 -3.57,3.22 1.25,8.94 1.14,2.18 2.08,2.98 3.22,3.45 3.36,2.22 9.25,2.09 6.82,4.58 z" title="Kosovska Mitrovica" id="XK-KM" onclick="addActive02()" value="2" name="Mitrovica" class="active"></path>

因此,添加了活动类,您可以毫无问题地选择 SVG,然后您的问题必须出现在如何在 PHP 中传递或操作数据。

另外,作为旁注,您应该尽量不要重复相同的代码,例如,您可以在一个函数中完成所有这些函数正在执行的所有操作,例如,您将 svg ID 作为参数传递给该函数。

最新更新