нагрузки HTML с JQuery

интересно, если это Возможное для загрузки содержимого HTML так:нагрузки HTML с JQuery

У меня есть этот кусок кода в JS

var main = [{ 
    title:'Title', 
    imageProject: 'images/t1.jpg', 
    content: 'page1.html' 
},{ 
    title:'Title2', 
    imageProject: 'images/t2.jpg', 
    content: 'page2.html' 
},{ 
    title:'Title3', 
    imageProject: 'images/t3.jpg', 
    content: 'page3.html' 
}] 

container = $('<div />', {class:'container'}); 

$.each(main, function(i, e){ 
    var item = $('<div />', { 
    class:'item', 
    html:'<div><img src="' + e.imageProject + '" class="img-responsive" alt="' + e.title + '"><h2>' + e.title + '</h2></div>' + 
    '<div class="content"><p>' + e.content + '</p></div></div>' 
    }) 
    container.append(item); 
}); 
container.appendTo($('main'));

Цель состоит в том, чтобы присвоить HTML файл в переменную содержимое, которое будет использоваться внутри функции, где я создаю структуру HTML. Это возможно?

Большое спасибо заранее.

источник

2017-02-17 tanaan

Вы хотите, чтобы динамический включил и включил клиентскую сторону? Конечно, это возможно. Также обратите внимание, что то, что вы сейчас делаете, открывает широкие возможности для инъекций и неверного HTML. Не конкатенируйте произвольные данные в контексте HTML. Каждый раз, когда вы берете данные и используете их в другом контексте, он должен быть экранирован. Самое лучшее, что вам нужно сделать, это создать элементы и установить их атрибуты. – Brad

Спасибо, Брэд. Просто хотелось узнать, возможно ли загрузить файл HTML так же, как и с другими объектами внутри основной переменной. Я имею в виду, что легко загрузить простой текст с помощью e.title, но я не знаю, могу ли я загрузить файл HTML с помощью e.content. Большое спасибо. – tanaan

Вы можете использовать AJAX запрос, чтобы получить содержимое HTML Посмотрите, если это помогает Loading DIV content via ajax as HTML

источник

2017-02-17 23:39:20 vladwoguer

Спасибо за ответ vladwoguer. Я прочитал этот пост, но не уверен, что это может сделать работу, извините, если я не понимаю его правильно. Как вы видите, я генерирую div с контейнером класса, а затем еще несколько div, в зависимости от количества объектов внутри основной переменной. Каждый из этих divs будет иметь элемент класса, и у них будет другой код html, который будет заполнен содержимым внутри каждого объекта. Проблема в том, что я хотел бы добавить файл HTML в файл e.content. Я не видел пути в сообщении, которое вы сказали. Опять же, извините, если я что-то не понял. – tanaan

Привет, tanaan, с ajax вы можете запросить html-файл, и вы можете загрузить его на свой e.content. Позвольте мне посмотреть, могу ли я найти лучший пример. – vladwoguer

Спасибо vladwoguer, это было разобрано. Я попробую ответить позже. Давая идентификатор каждому '.content', мне просто нужно использовать' load(); '. По какой-то причине он просто работает на сервере, но он это делает. Хотя этот идентификатор поможет, если мне нужно будет взаимодействовать с каждым элементом в будущем. Еще раз спасибо за заботу. – tanaan

Как vladwoguer говорит выше, запрос Ajax является способ извлечения содержимого ваших HTML-страниц, но вы» Вам нужно что-то, чтобы обслуживать контент, который вы запрашиваете.

Простой скрипт PHP на стороне сервера может открыть запрошенный файл и повторить его содержимое в виде строки, которая будет интерпретироваться Jquery так же, как и строковая константа.

источник

2017-02-17 23:57:34

Спасибо, Джон, я знаю, что есть много способов загрузить HTML-файл с помощью JS или PHP (этот вариант нельзя использовать, я боюсь). Я просто хочу назначить HTML-файл для e.content для загрузки внутри создаваемого HTML-кода, как и для остальных объектов. Большое спасибо. – tanaan

Как получить e.content тег iframe, который имеет желаемую страницу html в качестве источника?

Вы даже можете добавить «border: none» в стиль iframe, чтобы он лучше вписывался в страницу. Вам нужно будет перепрыгнуть через несколько обручей, чтобы изменить страницу внутри iframe (если это даже необходимо), но это делает.

источник

2017-02-18 01:45:42

нагрузки HTML с JQuery

ответ

Смежные вопросы