Форум программистов, компьютерный форум, киберфорум
Наши страницы
JavaScript
Войти
Регистрация
Восстановить пароль
 
Ryder787
0 / 0 / 0
Регистрация: 15.05.2014
Сообщений: 16
1

Как в javascript из массива ссылок вычислить ту, которая была нажата?

28.05.2014, 23:11. Просмотров 445. Ответов 5
Метки нет (Все метки)

Такая проблема. К примеру есть массив, содержащий категорию, название и цену товара. В первое окно я вывожу только категорию и название, название должно быть кликабельным. При клике в другом окне должна появиться подробная информация о товаре, на который нажали, а именно: Категория, название и цена.
Так вот, в первое окно, информация выводиться, названия кликабельны, а вот как определить элемент, по которому нажали, чтобы вывести информацию не знаю. ПОМОГИТЕ!!!

HTML5
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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="css\style.css">
  <script src="javascript\js.js"></script>
</head>
<script type="text/javascript">
 
</script>
<body class="main-fon">
<div class="for-form">
<form id="form-in">
    <p >Input category</p>
    <input type="text" class="" name="category" id="category">
    <p>Input name</p>
    <input type="text" class="" name="name" id="name">
    <p>Input price</p>
    <input type="text" class="" name="price" id="price">
    <input id="button" type="button" value="Input" onClick="getName();" />
</form>
<form id="form-out">
    <p >All data</p>
    <div id="see-info"></div>
</form>
<form id="form-info">
    <p >About </p>
    <div id="details"></div>
    <input id="add" type="button" value="add"  />
</form>
<form id="form-card">
    <p >card</p>
    <div id="card"></div>
</form>
</div>
<script type="text/javascript">
 
</script>
</body>
</html>
CSS
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
#form-in{
width:200px;
float:top;
}
 
#form-out{
min-width:250px;
clear:both;
float:left;
}
 
#form-info{
width:220px;
float:left;
}
 
#form-card{
width:220px;
float:left;
}
 
#details{
width:220px;
min-height:100px;
background-color:white;
box-sizing: border-box;
font-size:17px;
text-align:center;
}
 
#card{
width:220px;
min-height:100px;
background-color:white;
box-sizing: border-box;
font-size:17px;
text-align:center;
}
 
p{
margin:0px;
font-size:16px;
}
 
input{
border-radius:4px;
width:190px;
}
 
#button{
width:100px;
text-align:center;
float:right;
margin-top:3px;
}
 
#add{
width:50px;
margin:5px;
}
 
textarea{
resize:none;
}
 
form{
background-color:skyblue;
height:auto;
overflow:hidden;
padding:5px;
display:block;
border:1px solid black;
border-radius:4px;
}
 
.for-form{
height:auto;
width:780px;
margin:auto;
overflow:hidden;
}
 
#see-info{
width:250px;
min-height:100px;
background-color:white;
box-sizing: border-box;
font-size:17px;
text-align:center;
}
Javascript
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
var k=0;
var mas = [];
 
function getName(){
    var cat = document.getElementById('category').value; 
    var name = document.getElementById('name').value; 
    var price = document.getElementById('price').value; 
 
    if(cat.length===0){
        alert("You must input cat");
        return;
    }
    
    if(name.length===0){
        alert("You must input name");
        return;
    }
    
    if(price.length===0){
        alert("You must input price");
        return;
    }
    
    var masIn = [];
    for(i=0;i<k+1;i++){
        masIn[0] = cat;
        masIn[1] = name;
        masIn[2] = price;
    }
    
    mas.push(masIn);
    mas.sort();
    div=document.getElementById('see-info');
    div.innerHTML=null;
 
    for(i=0;i<k+1;i++){
        div.innerHTML += "<strong>" + mas[i][0] + "</strong>" + "<br>";
        div.innerHTML += "<a href='#' onclick='About'>" + mas[i][1] + "</a>" + "<br>";
    }
 
    k=k+1;
}
 
function About(){
    
}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
28.05.2014, 23:11
Ответы с готовыми решениями:

Как отследить, какая клавиша была нажата?
собственно сабж. нужно проверить какая клавиша была нажата и принять решение,...

Проверка, была ли нажата радиокнопка
&lt;script language=&quot;JavaScript&quot;&gt; function gol(form){ if (typeof...

Достать в контейнере (выводятся циклом) именно тот класс, где была нажата кнопка
div class=container div class=result button class=btn /div...

Достать в контейнере (контейнеры выводятся циклом) именно тот класс, где была нажата кнопка
div class=container div class=result button class=btn /div...

Как определять, какая клавиша была нажата?
1) как определять, какая клавиша была нажата? 2) как определить время, которое...

5
kalabuni
Нарушитель
3244 / 2567 / 616
Регистрация: 18.04.2012
Сообщений: 7,714
28.05.2014, 23:39 2
проблема в ином: пишете в заголовке про "массив ссылок", а в вашем HTML-коде нет вообще ни одного тега <A>
0
Ryder787
0 / 0 / 0
Регистрация: 15.05.2014
Сообщений: 16
28.05.2014, 23:44  [ТС] 3
Теги <a> создаются во время заполнения массива.Название каждого товара должно быть как ссылка. Так что в теме все написано правильно
0
massEffect
80 / 80 / 53
Регистрация: 22.03.2013
Сообщений: 260
29.05.2014, 11:26 4
можно допустим id ставить ссылкам, по которому можно определить нужный элемент массива,
а потом делегированием по e.target определить нужную ссылку, или непосредственно, как у вас по onclick, кстати в
HTML5
1
"<a href='#' onclick='About'>"
, забыли скобки после About.
0
Ryder787
0 / 0 / 0
Регистрация: 15.05.2014
Сообщений: 16
29.05.2014, 17:52  [ТС] 5
Вроде решил проблему,
Javascript
1
2
3
4
for(i=0;i<k+1;i++){
        div.innerHTML += "<strong>" + mas[i][0] + "</strong>" + "<br>";
        div.innerHTML += "<a href='#' onclick='About("+ i +");' name="+i+">" + mas[i][1] + "</a>" + "<br>";
    }
т.е. в вызывающуюся функцию поступает номер ссылки. ТОлько если кто знает способ как словить последную нажатую ссылку. А то я пока не разобрался с этим
0
newJS
2397 / 1070 / 307
Регистрация: 23.06.2011
Сообщений: 3,330
29.05.2014, 21:54 6
разбирайся
Javascript
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
onload=function(){
ul1();
ul2();
 };
 
function ul1(){//онлоад нужен чтобы дерево построилось
ul_1.onclick=function(ev){//один клик на UL
ev=ev?ev.target:event.srcElement;
alert(ev.innerHTML);
};
 };
 
function ul2(){//клик на каждый LI
var m, k;
m=document.getElementById("ul_2").getElementsByTagName("li");
k=m.length;
while(k--){m[k].onclick=myLI;};
 };
 
function myLI(){
var s;
s=this.innerHTML;
alert(s);
 };
 
function clickUL(ev){
var el;
if(window.ActiveXObject){el=ev.srcElement;}else{el=ev.target;};
alert(el.innerHTML);
 };
HTML5
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
<div>Клик по разным цветам даёт разный результат.</div>
<ul id="ul_1">
<li>Раздел 1</li>
<li>Раздел 2</li>
<li>Раздел 3</li>
<li>Раздел 4</li>
<li>Раздел 5</li>
<li><span>Раздел 6</span></li>
</ul>
 
<div>Клик только по LI</div>
<ul id="ul_2">
<li>Раздел 1</li>
<li>Раздел 2</li>
<li>Раздел 3</li>
<li>Раздел 4</li>
<li>Раздел 5</li>
<li>Раздел 6</li>
</ul>
 
<div>Так дучше не делать, события лучше вешать скриптом.</div>
<ul onclick="clickUL(event);" class="ul_3">
<li>Раздел 1</li>
<li>Раздел 2</li>
<li>Раздел 3</li>
<li>Раздел <span>4</span></li>
<li>Раздел 5</li>
<li>Раздел 6</li>
</ul>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
#ul_1 {background:lavenderblush; margin-top:0;}
#ul_1 li {cursor:pointer; margin:9px 0; background:mistyrose;}
#ul_1 li:hover {background:lavender;}
#ul_1 li span {background:tan;}
 
#ul_2 {margin-top:0;}
#ul_2 li {cursor:pointer;}
#ul_2 li:hover {background:lavender;}
 
.ul_3 {background:lavenderblush; margin-top:0;}
.ul_3 li {cursor:pointer; margin:9px 0; background:mistyrose;}
.ul_3 li:hover {background:lavender;}
.ul_3 li span {background:peru; color:white; padding:0 9px;}
0
29.05.2014, 21:54
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
29.05.2014, 21:54

Как отследить, какая кнопка была нажата
Есть представление, в котором есть несколько кнопок Есть контроллер, в котором...

Как узнать какая кнопка была нажата?
такой код: HMTL &lt;form action='myasp.asp' method=post name='form1'&gt; &lt;input...

Как определить какой JButton была нажата
Есть jbutton1, jbutton2 в jframe и каждый из них направление на другие jframe ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru