MichaelConsta Ответов: 1

Как мне (onclick on table) показать номер в метке или текстовом поле


Привет там, я почти закончил свой код, все еще есть еще один маленький шаг, проверьте мой код, пожалуйста, чтобы увидеть, что это такое
<pre><html>
<head>

<script>
window.onload = function(){

    var all = document.getElementsByTagName("td");
    for (var i=0;i<all.length;i++) {
        all[i].onclick = inputClickHandler;       
    }
};

function inputClickHandler(e){
    e = e||window.event;
    var tdElm = e.target||e.srcElement;
    if(tdElm.style.backgroundColor == 'rgb(255, 0, 0)'){
        tdElm.style.backgroundColor = '#fff';
    } else {
        tdElm.style.backgroundColor = '#f00';
    }
}
</script>




</head>

<body>

<style>


td:hover, th:hover { cursor:pointer }

table {
  border-collapse: collapse;
}
table, tr, td {
  border: 1px solid black;
}
tr, td {
  padding: 7px;
  text-align: center;
}

table { 
    border-spacing: 3px;
    border-collapse: separate;
}

</style>

<form>
<table border width=''500'' height=''500'' cellspacing=''0'' cellpadding=''0'' align=center>

<tr>
<td >01</td>
<td >02</td>
<td >03 </td>
<td >04</td>
<td >05 </td>
<td >06</td>
<td >07 </td>
<td >08</td>
<td >09 </td>
<td >10</td>
</tr>

<tr>
<td >11</td>
<td >12</td>
<td >13 </td>
<td >14</td>
<td >15 </td>
<td >16</td>
<td >17 </td>
<td >18</td>
<td >19 </td>
<td >20</td>
</tr>

<tr>
<td >21</td>
<td >22</td>
<td >23 </td>
<td >24</td>
<td >25 </td>
<td >26</td>
<td >27 </td>
<td >28</td>
<td >29 </td>
<td >30</td>
</tr>

<tr>
<td >31</td>
<td >32</td>
<td >33 </td>
<td >34</td>
<td >35 </td>
<td >36</td>
<td >37 </td>
<td >38</td>
<td >39 </td>
<td >40</td>
</tr>

<tr>
<td >41</td>
<td >42</td>
<td >43 </td>
<td >44</td>
<td >45 </td>
<td >46</td>
<td >47 </td>
<td >48</td>
<td >49 </td>
<td >50</td>
</tr>

<tr>
<td >51</td>
<td >52</td>
<td >53 </td>
<td >54</td>
<td >55 </td>
<td >56</td>
<td >57 </td>
<td >58</td>
<td >59 </td>
<td >60</td>
</tr>

<tr>
<td >61</td>
<td >62</td>
<td >63 </td>
<td >64</td>
<td >65 </td>
<td >66</td>
<td >67 </td>
<td >68</td>
<td >69 </td>
<td >70</td>
</tr>

<tr>
<td >71</td>
<td >72</td>
<td >73 </td>
<td >74</td>
<td >75 </td>
<td >76</td>
<td >77 </td>
<td >78</td>
<td >79 </td>
<td >80</td>
</tr>

<tr>
<td >81</td>
<td >82</td>
<td >83 </td>
<td >84</td>
<td >85 </td>
<td >86</td>
<td >87 </td>
<td >88</td>
<td >89 </td>
<td >90</td>
</tr>
</table>
</form>
</body>





</html>

это приятно, как вы видите, но не могли бы вы помочь мне, сказав, как можно показать цифры, которые нажимаются в таблице где-то под столом ?! например, если я нажму на цифру 1, то под столом появится цифра один, а если я нажму на цифру 2, то она будет отображаться как будет, так что цифра 1 не исчезнет, но между ними должно быть пространство или", " или что-то еще .. спасибо, желаю вам всего наилучшего

Что я уже пробовал:

я много пробовал сделать это сам и искал здесь и на многих других сайтах

1 Ответов

Рейтинг:
1

F-ES Sitecore

Есть массив на Вашей странице, как

var numbers = [];


вы можете получить содержимое td, на который вы нажали, через

tdElm.innerText


В коде, где вы выбираете число, добавьте его в массив чисел

numbers.push(tdElm.innerText);


В коде, где вы очищаете значение, удалите его из массива (google "javascript remove from array")

Это дает вам массив всех выбранных чисел, поэтому используйте "join", чтобы объединить их в строку и показать эту строку в текстовом поле или в любом другом месте, которое вы хотите.

Чтобы опередить ваш следующий вопрос, нет, я не буду писать код для вас, это не код для заказа сайта, где мы делаем вашу работу, но если вы соедините вышеперечисленные элементы вместе, у вас должно быть решение.


MichaelConsta

Я вижу, да, спасибо за помощь, кстати, цитата говорит примерно так
("Дайте человеку рыбу, и вы кормите его в течение дня; научите человека ловить рыбу, и вы кормите его в течение всей жизни"), но это не говорит показать этому человеку, что вы знаете, как ловить рыбу ..