Question

注意：我已经发布了以下问题（Get the value of the dynamic anchor tag and pass it to the next page）的答案，但是有一个小故障。所以再次发布它。这不是任何现有线程的重复

我想使用Tornado，html，javascript -

来实现以下功能

点击链接（锚标记）{具有动态生成的值 - {{d [0]}}，来自MySQL数据库（id）。}，我应该能够获得id值（比如说） 100）并将其发送到龙卷风控制器并使用逻辑来提取与该id相关的所有细节。

id --------注意

100 -----注意100

101 -----关于101的注释

第1步 -

a href =＆＃34; TornadoHandlerPath＆＃34;

会将其作为默认的Get Method发送，但我希望使用Post Method发送它。

所以我按照这个链接 - http://www.javascript-coder.com/javascript-form/javascript-form-submit.phtml

将方法发布到表单中。所以我的新锚标签看起来像这样

  a href="javascript: submitForm()" id="id" name="id">
                                   {{d[0]}}  </a>

第2步 - 我在锚标记

上方的html中包含了一个隐藏字段

  <input type="hidden" name="cid" id="cid">

并在javascript函数中我得到了id的值并将其分配给隐藏字段。

因此，当表单提交时，id将与post请求一起发送。

function submitForm() {
var id = $("#id").html();        
var hidden = document.getElementById("cid");
hidden.value = id;
var form = document.getElementById("form"); 
form.submit();

}

在Tornado Handler中，我用self.get_argument（＆＃34; cid＆＃34;）抓住了它，然后继续逻辑实现。

此方法中存在故障。即使我点击不同的id说103，它仍然只显示id 100的详细信息！这是因为我根据id提取数据。并且所有行都具有相同的ID。

我尝试使用

var id = $(this).closest('td').html(), but it dint work.

整个代码都在这里 -

$('.alink').on('click', function() {

var id = $(this).closest('td').html();

var hidden = document.getElementById("cid");
hidden.value = id;
var form = document.getElementById("form"); 
form.submit();
});

HTML

<td>
<form name="form" id="ft" action="/TornadoHandler" method="Post">
<input type="hidden" name="cid" id="cid">                                         
<a href="javascript: submitForm()" class="alink" id="id" name="id"> {{d[0]}} </a>
</form>
</td>

我被困在这里很久了。请帮助我!!

Answer 1

您可以使用数据属性来移动数据。不需要隐藏字段，只需将其直接放在锚标记上

function submitForm(thelink){  alert(thelink.getAttribute('data-info'));
      
}

<a href=""onclick="javascript: submitForm(this)" data-info="hello from data attribute 1"class="alink" id="configid" name="configid"> 1 </a>
<a href=""onclick="javascript: submitForm(this)" data-info="hello from data attribute 2"class="alink" id="configid" name="configid"> 2 </a>
<a href=""onclick="javascript: submitForm(this)" data-info="hello from data attribute 3"class="alink" id="configid" name="configid"> 3 </a>

获取锚标记的动态值

1 个答案: