如何使用来自json的数据填充href标记，并在单击时使用表单中的选定值进行发布

Question

hope all of you have a really nice day. 希望大家度过愉快的一天。 Im working on a project right now and i cant seem to get this right. 我现在正在做一个项目，我似乎做不到这一点。 I have the following Json. 我有以下杰森。

{
"Error":200,
"Fecha":"6/19/2018",
"Nombreag":"Canchas de Tenis",
"Nombretges":"Reserva de cancha",
"horarios":[
    {
        "horaM":"1000",
        "hora":"10:00AM"
    },
    {
        "horaM":"1030",
        "hora":"10:30AM"
    },
    {
        "horaM":"1100",
        "hora":"11:00AM"
    },
    {
        "horaM":"1130",
        "hora":"11:30AM"
    },
    {
        "horaM":"1200",
        "hora":"12:00PM"
    },
    {
        "horaM":"1230",
        "hora":"12:30PM"
    },
    {
        "horaM":"1300",
        "hora":"01:00PM"
    },
    {
        "horaM":"1330",
        "hora":"01:30PM"
    },
    {
        "horaM":"1400",
        "hora":"02:00PM"
    },
    {
        "horaM":"1430",
        "hora":"02:30PM"
    },
    {
        "horaM":"1500",
        "hora":"03:00PM"
    },
    {
        "horaM":"1530",
        "hora":"03:30PM"
    },
    {
        "horaM":"1600",
        "hora":"04:00PM"
    },
    {
        "horaM":"1630",
        "hora":"04:30P.M."
    },
    {
        "horaM":"1700",
        "hora":"05:00P.M."
    }
]

} }

And i would like to add a href link based on all the Json inside horarios. 我想基于horios中的所有Json添加href链接。 This is for a HTML form to make a POST to my api, i want to display "hora" in the List view and when clicked set the horaM value for using that selection to post. 这是用于HTML表单以对我的api进行POST，我想在“列表”视图中显示“ hora”，然后单击以设置horaM值以使用该选择进行发布。

I know i have to use Javascript DOM like this but cant get to work the onclick on the href pass that value to the variable and marked it as selected. 我知道我必须像这样使用Javascript DOM，但是无法使用href上的onclick将该值传递给变量并将其标记为选中状态。

I was thinking maybe something like this to get the value. 我在想也许是这样的事情来获得价值。

<!DOCTYPE html>
<html>
<body>

<p>
<ul id="loadListview" data-role="listview" data-inset="true" >
  <li><a href="#" id="1200" onclick="myFunction()">12:00PM</a></li>
  <li><a href="#" id="1230" onclick="myFunction()">12:30PM</a></li>  
  <li><a href="#" id="1300" onclick="myFunction()">1:00PM</a></li>  
  <li><a href="#" id="1330" onclick="myFunction()">1:30PM</a></li>  
</ul>

<p id="demo"></p>

<script>
function myFunction() {
    var x = this.href;
    document.getElementById("demo").innerHTML = x;
}
</script>

</body>
</html>

But im getting undefined value. 但即时通讯获得不确定的价值。

Thanks in advance for all your kind help and i greatly appreciate you taking the time for reading this. 在此先感谢您提供的所有帮助，非常感谢您抽出宝贵的时间阅读本文。

Answer 1

In order to tell myFunction which a is clicked, you need to pass this to the onclick function, so it will look like this onclick="myFunction(this)" 为了告诉myFunction其中a点击，你需要通过this来的onclick功能，所以它看起来是这样onclick="myFunction(this)"

<ul id="loadListview" data-role="listview" data-inset="true" >
    <li><a href="#THIS_HREF" data-hora="1200" onclick="myFunction(this)">12:00PM</a> </li>
</ul>
<p id="demo">x</p>

and then in the function add argument a . 然后在函数中添加参数a 。 Also i will recommend using data-{attribute} like so 我也建议像这样使用data-{attribute}

<script>
function myFunction(a) {
 var x = a.href; // "a" is the clicked element
 document.getElementById("demo").innerHTML = x;
 console.log(a.dataset.hora) // here is the data-hora attribute
 return false;
}
</script>

如何使用来自json的数据填充href标记，并在单击时使用表单中的选定值进行发布

问题描述

1 个解决方案

解决方案1
0 已采纳 2018-09-09 19:09:25

如何使用来自json的数据填充href标记，并在单击时使用表单中的选定值进行发布

问题描述

1 个解决方案

解决方案1 0 已采纳 2018-09-09 19:09:25

解决方案1
0 已采纳 2018-09-09 19:09:25