如何从 HTML 表格中调用 javascript 函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20439959/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to call a javascript function from a table in HTML
提问by user3004356
I'm new to Javascript and HTML. Now, I'm using HTML to display a time retrieved from XML file. Below is the HTML tags.
我是 Javascript 和 HTML 的新手。现在，我使用 HTML 来显示从 XML 文件中检索到的时间。下面是 HTML 标签。
<tr>
<th>Date of Birth: </th>
<td>{{dob}}</td>
</tr>
This will display the date in yyyy-mm-dd .i.e date will be displayed as 2012-03-12 I want this to be displayed as 12 Mar 2013. I used moment.min.js but was not successfull. I don't know how to call a javascript function from tags and get the date displayed accordingly.
这将在 yyyy-mm-dd 中显示日期。即日期将显示为 2012-03-12 我希望它显示为 2013 年 3 月 12 日。我使用了 moment.min.js 但没有成功。我不知道如何从标签调用 javascript 函数并相应地显示日期。
回答by Hymanson
<table>
<tr>
<th>Date of Birth: </th>
<td id='date-of-birth'></td>
</tr>
</table>
<script src="http://momentjs.com/downloads/moment.min.js"></script>
<script>
var dob = '2012-03-12';
var dateString = moment(dob).format('DD MMMM YYYY');
var element = document.getElementById('date-of-birth');
element.innerHTML = dateString;
</script>
However, if you want to use the {{variable}}bracket syntax for inserting values into your HTML, you can use a JavaScript templating library like Handlebars.
但是，如果您想使用{{variable}}括号语法将值插入到 HTML 中，您可以使用 JavaScript 模板库，如Handlebars。
Here's an example:
下面是一个例子：
<script id="sample-template" type="text/x-handlebars-template">
<table>
<tr>
<th>Date of Birth: </th>
<td>{{dob}}</td>
</tr>
</table>
</script>
<div id="output"></div>
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.1.2/handlebars.min.js"></script>
<script src="http://momentjs.com/downloads/moment.min.js"></script>
<script>
var dob = '2012-03-12';
var dateString = moment(dob).format('DD MMMM YYYY');
var source = $('#sample-template').html();
var template = Handlebars.compile(source);
$('#output').html(template({dob: dateString}));
</script>
Fiddle.(Edit:Wrong link. Fixed.)
小提琴。（编辑：错误的链接。已修复。）
回答by tewathia
<tr>
<th>Date of Birth: </th>
<td class="tdDOB">{{dob}}</td>
</tr>
This will work
这将工作
var dob = new Date($('td.tdDOB').val());
var dobArr = dob.toDateString().split(' ');
var dobFormat = dobArr[2] + ' ' + dobArr[1] + ' ' + dobArr[3];
$('td.tdDOB').val(dobFormat);
回答by ramchauhan
<span class="getdate" style="display:none;">2012-03-12</span>
<table>
<tr>
<th>Date of Birth: </th>
<td class="dateofbirth"></td>
</tr>
</table>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://momentjs.com/downloads/moment.min.js"></script>
<script type="text/javascript">
$("document").ready(function(){
var dob = $('.getdate:hidden').text();
var dateString = moment(dob).format('DD MMMM YYYY');
$('.dateofbirth').html(dateString);
})
</script>
You have to put your variable in any div or span and then get that value by using as described in the javascript and then use moment.js to format as you want and then put that variable in to the desired td with jquery.
您必须将变量放在任何 div 或 span 中，然后按照 javascript 中的描述使用该值获取该值，然后使用 moment.js 根据需要进行格式化，然后使用 jquery 将该变量放入所需的 td 中。
As in this case you can put your variable in the span and then get that value with jquery and then i formatted that as you want then i am putting that value in the td with .html
在这种情况下，您可以将变量放在跨度中，然后使用 jquery 获取该值，然后我根据需要对其进行格式化，然后我将该值放入带有 .html 的 td 中
