Как отправить динамически созданные входные (или текстовые) значения в iframe и показать его как HTML внутри iframe?

0

Как отправить динамически созданные входные (или текстовые) значения в iframe и показать его как HTML внутри iframe?

Я пытаюсь сделать это с помощью кода ниже (на JSFiddle), но другие решения тоже будут хороши. Благодарю. JQuery тоже хорош.

Здесь HTML:

<a href="#" id="new" rel="create">new</a><br>
<a href="#" id="another" rel="create">another</a><br>

<input id="thisButton" type="button" name="Display" value="Edit HTML Below then Click to Display"/>

<iframe id="iframetest" src="" style="background: White;"></iframe>

Здесь Javascript:

var counter = {};

var myHTML = {
    'new': '<input id="test%n" name="test" value="<b>blah</b> blah blah %n">',
    'another': '<input id="another%n" name="test" value="<b>cool</b> COOL! %n">'
};

var htmlForId = {
    'foo': ['a','b','c'],
    'bar': ['d','e','f']
}

var createEls = document.querySelectorAll('a[rel=create]');
for(var i = 0; i < createEls.length; i++) {

  createEls[i].onclick = create;
}

function create() {
    var id = this.id;

    var div = document.createElement('div');
    div.className = 'create';
    if (counter[id]===undefined) { counter[id] = 1; }
    var thecurrentid = counter[id];
    div.id = id + counter[id]++;

    if (div.id in myHTML) {
        div.innerHTML = myHTML[div.id].replace(/%n/g, thecurrentid);
    } else if (this.id in myHTML) {
        div.innerHTML = myHTML[this.id].replace(/%n/g, thecurrentid);
    } else {
        div.innerHTML = div.id;
    }
    document.body.appendChild(div);

    return false;
}

var myArray = [
    'b<strong>l</strong>a bla bla', // index 0
    'foo', // index 1
    'test' // index 2
];
function appendArray(a) {
    for(var i = 0; i < a.length; i++) {
        var div = document.createElement('div');
        div.className = 'loop';
        div.innerHTML = a[i];
        document.body.appendChild(div);
    }
}

jsfiddle: http://jsfiddle.net/bBf9j/8/

jsfiddle с комментариями (если необходимо): http://jsfiddle.net/bBf9j/7/

Теги:

1 ответ

0

вы можете получить доступ к объекту документа iframe, используя contentDocument

document.getElementById("thisButton").onclick = function(){
    var html = "<b>Dynamic Content</b>"; //TODO: get the value dynamically from textbox
    document.getElementById("iframetest").contentDocument.body.innerHTML = html;
};
  • 0
    Может ли кто-нибудь помочь мне собрать это вместе? я новичок в JavaScript
  • 0
    в чем проблема?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню