Javascript 将值从DIV元素传递到输入

我有一个PHP日历表单（作为基础生成，但经过大量定制和更新），它以表格格式一次输出两个月-30/31天

我试图创建的是一个业务会议预订表单，客户用户可以点击HTML日历上的一个日期，并将该日期的值作为整个日期值，而不仅仅是将日期传递到输入字段

我希望实现类似（伪代码）的功能： （2015年3月的日历月）

---

并以某种方式使用id字符串

13032015

作为输入中的日期字符串？

无需id且动态：

$('td > div').on('click', function() {
    var value = $(this).attr('value');
    // do something with this value
});

---

对于日期格式，请查看

，您可以向div添加一个类

然后，需要对类中填充输入值的每个元素进行onclick。 这在这里和这里都有描述。

第1部分-如何让JQuery从DIV中获取一个值，我可以将值放入输入中-这很简单，但我需要表中每个DIV都有一个唯一的ID（60+），我不打算写出60+个JQuery规则，每个DIV ID都有一个，必须有一种更好、更动态的方法来做到这一点

关键字在JavaScript中是一个强大的工具。理解需要一段时间，但从长远来看可以节省更多的时间

$(document).ready(function() {
    $('.click_me').click(function() {
        alert($(this).attr('value'));
    });
});

第2部分-一旦选择了一个值，我将如何格式化该值，使其成为完整日期而不是代码日期标识符？类似于PHP date（）函数的内容

在JavaScript中使用以格式化文本

$(document).ready(function() {
    $('.click_me').click(function() {
        var new_date = new Date($(this).attr('value'));
        alert(new_date.getDate() + "/" + (new_date.getMonth()+1) + "/" + new_date.getFullYear());
    });
});

---

1：您可以使用数据属性来存储数据

 to set value=   $(element).data("date","");
 to get value=   $(element).data("date");
        <td><div **data-date**='13032015' id='something'>13</div></td>

要使

包含innerHTML以外的数据，请使用。因此，您的HTML应该如下所示：

<td><div data-value='13032015' id='something'>13</div></td>

13
复制

我认为最好的方法是同时使用数据属性。您有一个带有格式化日期的数据属性和一个带有后端所需日期的数据属性

当用户单击日期时，只需将格式化的日期放入正常输入，并将后端所需的值放入隐藏字段

HTML

<div class="date" data-value='13032015' data-formatted="13th March 2015" id='something'>13</div>
<div class="date" data-value='14032015' data-formatted="14th March 2015" id='something'>14</div>
<div class="date" data-value='15032015' data-formatted="15th March 2015" id='something'>15</div>
<input type='text' value='' name='dateA' id='dateF'> 
<input type='hidden' value='' name='dateA' id='dateD'>

---

太棒了，这看起来像我需要的-我会给它一个测试，让你知道。Cheers这很有效，

attr（'value'）

就是我要找的语法。我认为你和埃斯科贝尔的答案都是正确的，但他的答案更详细。不过我已经给你打了分：）。为您的帮助干杯没问题@Martin；）干杯，我使用了

值

字段来保存文本字符串，所以我只需将字符串传递给输入。容易多了！虽然可以使用attr（）函数获取该值，但value不是div的all的有效属性。此外，我的帖子也涉及到你的第二个问题。由于您可以使用php函数正确设置格式化的日期字段。我会将您和Rwam的答案都标记为正确，为帮助干杯我根据您的示例将

value

更改为

data value

。

 to set value=   $(element).data("date","");
 to get value=   $(element).data("date");
        <td><div **data-date**='13032015' id='something'>13</div></td>

var milliseconds  = Date.parse("2013/01/01");

<td><div data-value='13032015' id='something'>13</div></td>

<div class="date" data-value='13032015' data-formatted="13th March 2015" id='something'>13</div>
<div class="date" data-value='14032015' data-formatted="14th March 2015" id='something'>14</div>
<div class="date" data-value='15032015' data-formatted="15th March 2015" id='something'>15</div>
<input type='text' value='' name='dateA' id='dateF'> 
<input type='hidden' value='' name='dateA' id='dateD'>

var date = $('.date');
var inputD = $('#dateD');
var inputF = $('#dateF');
date.on('click', function(){
    var valueD = $(this).data('value');
    var valueF = $(this).data('formatted');
    inputD.val(valueD);
    inputF.val(valueF);
    console.log(valueD);
});