2016-09-09 5 views
0

У меня есть таблица, однозначно идентифицирующая каждую строку с отметкой времени. Я хочу иметь привязку для каждой строки.Возможно создание виртуального якоря?

Есть ли способ избежать необходимости создания нового столбца «якоря» и необходимости программной записи <a name = "(row.ID}}" для каждой записи?

Если у меня есть уникальная метка времени в текстовом формате, могу ли я создать виртуальный якорь?

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

Там нет идентификаторов элементов, и я не хочу, чтобы написать программный код для создания идентификатора, например:

<tr id="row9"><td>9</td></tr> 
<tr id="row10"><td>10</td></tr> 

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

+1

Да - вы можете связать непосредственно к элементу его 'id', полагая, что' id' как фрагмент в URL-адресе. Окно будет прокручиваться, чтобы поместить этот элемент в поле зрения при загрузке страницы. Например, это связано с элементом '# feed-link' на следующей странице: http://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript?rq=1#feed-link –

+0

Вопрос был непонятно. Я бы хотел, чтобы javascript автоматически прокручивался до места на странице, указанной по дате, когда сообщение было сделано. Например, проведите, пожалуйста, прокомментировать 2 июля 2016 года 11:44 A.M. Нет идентификаторов DIV или других структурированных якорей. –

+0

Мое замечание адресовано, что - если в элементе, содержащем комментарий, есть 'id', вы можете просто поместить этот' id' после '#' в URL. Для этого вам понадобится только JS, если вы хотите оживить прокрутку. –

ответ

0

Я не уверен, правильно ли я понял ваш вопрос, если вы можете влиять на то, как создается таблица, вы можете добавить уникальный атрибут id на каждый элемент <tr> и ссылаться на это из любого места (включая другие страницы) с помощью фрагмент uri (#id).

Ниже приводится рабочая демонстрация этого подхода (без Javascript требуется):

<a href="#row97">Scroll to #row97</a> 
 

 
<table> 
 
<tr id="row0"><td>0</td></tr> 
 
<tr id="row1"><td>1</td></tr> 
 
<tr id="row2"><td>2</td></tr> 
 
<tr id="row3"><td>3</td></tr> 
 
<tr id="row4"><td>4</td></tr> 
 
<tr id="row5"><td>5</td></tr> 
 
<tr id="row6"><td>6</td></tr> 
 
<tr id="row7"><td>7</td></tr> 
 
<tr id="row8"><td>8</td></tr> 
 
<tr id="row9"><td>9</td></tr> 
 
<tr id="row10"><td>10</td></tr> 
 
<tr id="row11"><td>11</td></tr> 
 
<tr id="row12"><td>12</td></tr> 
 
<tr id="row13"><td>13</td></tr> 
 
<tr id="row14"><td>14</td></tr> 
 
<tr id="row15"><td>15</td></tr> 
 
<tr id="row16"><td>16</td></tr> 
 
<tr id="row17"><td>17</td></tr> 
 
<tr id="row18"><td>18</td></tr> 
 
<tr id="row19"><td>19</td></tr> 
 
<tr id="row20"><td>20</td></tr> 
 
<tr id="row21"><td>21</td></tr> 
 
<tr id="row22"><td>22</td></tr> 
 
<tr id="row23"><td>23</td></tr> 
 
<tr id="row24"><td>24</td></tr> 
 
<tr id="row25"><td>25</td></tr> 
 
<tr id="row26"><td>26</td></tr> 
 
<tr id="row27"><td>27</td></tr> 
 
<tr id="row28"><td>28</td></tr> 
 
<tr id="row29"><td>29</td></tr> 
 
<tr id="row30"><td>30</td></tr> 
 
<tr id="row31"><td>31</td></tr> 
 
<tr id="row32"><td>32</td></tr> 
 
<tr id="row33"><td>33</td></tr> 
 
<tr id="row34"><td>34</td></tr> 
 
<tr id="row35"><td>35</td></tr> 
 
<tr id="row36"><td>36</td></tr> 
 
<tr id="row37"><td>37</td></tr> 
 
<tr id="row38"><td>38</td></tr> 
 
<tr id="row39"><td>39</td></tr> 
 
<tr id="row40"><td>40</td></tr> 
 
<tr id="row41"><td>41</td></tr> 
 
<tr id="row42"><td>42</td></tr> 
 
<tr id="row43"><td>43</td></tr> 
 
<tr id="row44"><td>44</td></tr> 
 
<tr id="row45"><td>45</td></tr> 
 
<tr id="row46"><td>46</td></tr> 
 
<tr id="row47"><td>47</td></tr> 
 
<tr id="row48"><td>48</td></tr> 
 
<tr id="row49"><td>49</td></tr> 
 
<tr id="row50"><td>50</td></tr> 
 
<tr id="row51"><td>51</td></tr> 
 
<tr id="row52"><td>52</td></tr> 
 
<tr id="row53"><td>53</td></tr> 
 
<tr id="row54"><td>54</td></tr> 
 
<tr id="row55"><td>55</td></tr> 
 
<tr id="row56"><td>56</td></tr> 
 
<tr id="row57"><td>57</td></tr> 
 
<tr id="row58"><td>58</td></tr> 
 
<tr id="row59"><td>59</td></tr> 
 
<tr id="row60"><td>60</td></tr> 
 
<tr id="row61"><td>61</td></tr> 
 
<tr id="row62"><td>62</td></tr> 
 
<tr id="row63"><td>63</td></tr> 
 
<tr id="row64"><td>64</td></tr> 
 
<tr id="row65"><td>65</td></tr> 
 
<tr id="row66"><td>66</td></tr> 
 
<tr id="row67"><td>67</td></tr> 
 
<tr id="row68"><td>68</td></tr> 
 
<tr id="row69"><td>69</td></tr> 
 
<tr id="row70"><td>70</td></tr> 
 
<tr id="row71"><td>71</td></tr> 
 
<tr id="row72"><td>72</td></tr> 
 
<tr id="row73"><td>73</td></tr> 
 
<tr id="row74"><td>74</td></tr> 
 
<tr id="row75"><td>75</td></tr> 
 
<tr id="row76"><td>76</td></tr> 
 
<tr id="row77"><td>77</td></tr> 
 
<tr id="row78"><td>78</td></tr> 
 
<tr id="row79"><td>79</td></tr> 
 
<tr id="row80"><td>80</td></tr> 
 
<tr id="row81"><td>81</td></tr> 
 
<tr id="row82"><td>82</td></tr> 
 
<tr id="row83"><td>83</td></tr> 
 
<tr id="row84"><td>84</td></tr> 
 
<tr id="row85"><td>85</td></tr> 
 
<tr id="row86"><td>86</td></tr> 
 
<tr id="row87"><td>87</td></tr> 
 
<tr id="row88"><td>88</td></tr> 
 
<tr id="row89"><td>89</td></tr> 
 
<tr id="row90"><td>90</td></tr> 
 
<tr id="row91"><td>91</td></tr> 
 
<tr id="row92"><td>92</td></tr> 
 
<tr id="row93"><td>93</td></tr> 
 
<tr id="row94"><td>94</td></tr> 
 
<tr id="row95"><td>95</td></tr> 
 
<tr id="row96"><td>96</td></tr> 
 
<tr id="row97"><td>97</td></tr> 
 
<tr id="row98"><td>98</td></tr> 
 
<tr id="row99"><td>99</td></tr> 
 
</table>

Смежные вопросы