json 如何使append()中的div工作？

xienkqul 于 2023-07-01 发布在其他

关注(0)|答案(1)|浏览(122)

我试图让id为black的div回显我的JSON数据，但它不起作用。
到目前为止，我已经这样做了，但它错过了时机，或者逻辑不正确。
我已经检查了JSON，它的格式正确。

<script>
    countPos = 0;
//get JSON from school.php
    $(document).ready(function(){
        $.getJSON('school.php', function(data) {
          window.console && console.log(data);
        window.console && console.log('Document ready called');
//if button with id addPos clicked, bring up function
        $('#addPos').click(function(event){
    
            event.preventDefault();
            if ( countPos >= 9 ) {
                alert("Maximum of nine position entries exceeded");
                return;
            }
            countPos++;
                window.console && console.log("Adding position "+countPos);
            $('#position_fields').append(
                '<div id="position'+countPos+'"><br><br >\
            <label for="year">Year:</label> <input type="text" size="80" name="year'+countPos+'" value="" /> \
            <input type="button" value="-" onclick="$(\'#position'+countPos+'\').remove();return false;"></p> \
                <label for="edu_school">School:</label> <input type="text" size="80" name="edu_school'+countPos+'" id="Autoschool'+countPos+'" value="" /><br>\
                <label for="position">Position:</label> <input type="text" size="80" name="posiition'+countPos+'" value="" /><br>\
                </div>\
            <div id = "black"></div>')})
                $ ('#black').html(data);
            });
        });
    });
</script>

JSON

来源：https://stackoverflow.com/questions/76578710/how-to-make-a-div-inside-an-append-work

1条答案

按热度按时间

tcomlyy61#

你的代码毫无意义。school.php返回什么？你在哪里使用它？addpos点击属于getJSON之外。你每次点击都添加，所以这已经是错误的了。您也可以执行<input type="button" value="-" onclick="this.closest('div').remove()" />，而不需要返回false，因为它是一个按钮
请试试这个。你的剧本有太多问题我刚重写了
假设school.php每次只返回一组数据
我将一些ID更改为class，并删除了其他ID。
对我来说，有数据的div仍然是个谜。在这里，我对每个位置重复它，但可能你只需要一次？

$(() => {
  let schoolData;
  $.getJSON('school.php', (data) => {
    schoolData = data;
  })
  $('#addPos').on('click', (event) => {
    event.preventDefault();
    const countPos = $('#position_fields').find('.position').length;
    if (countPos >= 9) {
      alert("Maximum of nine position entries exceeded");
      return;
    }
    $('#position_fields').append(`
      <div class="position">
        <label>Year: <input type="text" size="80" name="year${countPos}" value="" /></label>
        <input type="button" value="-" onclick="this.closest('div').remove()" />
        <label>School: <input type="text" size="80" name="edu_school${countPos} value="" /></label><br>
        <label>Position: <input type="text" size="80" name="posiition'+countPos+'" value="" /></label>
        <div class="black">${schoolData}</div>        
      </div>`);
  });
});

赞(0）回复(0）举报 2023-07-01

我来回答

json 如何使append()中的div工作？

1条答案

相关问题

热门标签

最新问答