Я пытаюсь вставить код materialize.css в метод html с помощью jquery.append(), но он продолжает отображать ошибку «Неожиданный недопустимый токен» . Я в замешательстве и думаю, что это может быть связано с escape-символом последовательности или обратной косой чертой ..

  $(".container").append("<div class='row'>
    <div class='col s12 m12'>
      <div class='card teal accent-1 hoverable' id='car'>
        <div class='card-content  center-align'>
          <span class='card-title'>" + "Question" + page.id +"</span>
          <form action='#'>
            <p>"+page.question+"</p>
            <p><input name='group1' type='radio' id='test1' />
              <label for='test1'>"+page.option[0]+"</label></p>
            <p><input name='group1' type='radio' id='test2' />
              <label for='test2'>"+page.option[1]+"</label></p>
            <p><input name='group1' type='radio' id='test3' />
              <label for='test3'>"+page.option[2]+"</label></p>
            <p><input name='group1' type='radio' id='test4' />
              <label for='test4'>"+page.option[3]+"</label></p>
          </form>
          <h6 id='error1'>Please select an option</h6>
        </div>
        <div class='card-action center'>
          <button class='btn' id='submit1'>Submit</button>
        </div>
      </div>
    </div>
  </div>");

Я использую объект json и перебираю его, используя переменную страницы. (JSON работает отлично). Заранее спасибо.

2
Kartikey Singh 30 Авг 2017 в 14:46

3 ответа

Лучший ответ

Вы не можете добавлять содержимое с помощью функции append() таким образом, вам следует заключить строки в строку:

$(".container").append("<div class='row'>"+
    "<div class='col s12 m12'>"+
      "<div class='card teal accent-1 hoverable' id='car'>"+
        "<div class='card-content  center-align'>"+
          "<span class='card-title'>" + "Question" + page.id +"</span>"+
          "<form action='#'>"+
            "<p>"+page.question+"</p>"+
            "<p><input name='group1' type='radio' id='test1' />"+
              "<label for='test1'>"+page.option[0]+"</label></p>"+
            "<p><input name='group1' type='radio' id='test2' />"+
              "<label for='test2'>"+page.option[1]+"</label></p>"+
            "<p><input name='group1' type='radio' id='test3' />"+
              "<label for='test3'>"+page.option[2]+"</label></p>"+
            "<p><input name='group1' type='radio' id='test4' />"+
              "<label for='test4'>"+page.option[3]+"</label></p>"+
          "</form>"+
          "<h6 id='error1'>Please select an option</h6>"+
        "</div>"+
        "<div class='card-action center'>"+
          "<button class='btn' id='submit1'>Submit</button>"+
        "</div>"+
      "</div>"+
    "</div>"+
"</div>");

Надеюсь это поможет.

2
Zakaria Acharki 30 Авг 2017 в 11:59

Неожиданный незаконный токен?

Вам необходимо concat каждую строку html с + и нужно заключить ее в кавычки в double quote

$(".container").append("<div class='row'>"+
    "<div class='col s12 m12'>"+
.......
    "</div>"+
  "</div>");
1
RIYAJ KHAN 30 Авг 2017 в 11:52

Здесь вы идете с решением

$(".container").append(`<div class='row'>
    <div class='col s12 m12'>
      <div class='card teal accent-1 hoverable' id='car'>
        <div class='card-content  center-align'>
          <span class='card-title'>Question ${page.id}</span>
          <form action='#'>
            <p>"+page.question+"</p>
            <p><input name='group1' type='radio' id='test1' />
              <label for='test1'>${page.option[0]}</label></p>
            <p><input name='group1' type='radio' id='test2' />
              <label for='test2'>${page.option[1]}</label></p>
            <p><input name='group1' type='radio' id='test3' />
              <label for='test3'>${page.option[2]}</label></p>
            <p><input name='group1' type='radio' id='test4' />
              <label for='test4'>${page.option[3]}</label></p>
          </form>
          <h6 id='error1'>Please select an option</h6>
        </div>
        <div class='card-action center'>
          <button class='btn' id='submit1'>Submit</button>
        </div>
      </div>
    </div>
  </div>`);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container"></div>

Вместо использования double quotes "" используйте backtick `` .

И где бы у вас ни было динамическое значение для присоединения, используйте ${}.

${variable_name} замените variable_name на имя вашей переменной.

Надеюсь, это поможет.

1
Shiladitya 30 Авг 2017 в 11:56