2016-01-18 3 views
0

Я хочу создать button, который создает еще один button. Другой button получает атрибут id, считая от 1 до бесконечности. Эта функция должна выполняться на всех кнопках (оригинальная кнопка и новости).javascript кнопки, запускающие другую кнопку

var btn = document.createElement("input"); 
btn.type = "button" 
btn.value = "button" 
btn.id = "btn_rv" 
body.appendChild(btn); 
+1

Предоставлено код будет работать нормально, за исключением ('document.body.appe..'). Возможно, это не будет в тех обстоятельствах, когда вы его выполняете. – Rayon

+0

его работа. я просто хочу создать кнопку, которая «создаст другую кнопку» с именем btn_rv_1 <- и когда я нажму на нее », она запустит другую кнопку anmed btn_rv_1_1» –

+0

Ваш вопрос не так? Обновите его, чтобы понять проблему. – Rayon

ответ

0

function create_another_button(elm) { 
 
    var counter = parseInt(elm.getAttribute('data-counter')); 
 
    var button = document.createElement('button'); 
 
    button.innerText = elm.id + '_' + counter; 
 
    button.id = elm.id + '_' + counter; 
 
    button.setAttribute('data-counter', '1'); 
 
    button.setAttribute('onclick','create_another_button(this)'); 
 
    document.body.appendChild(button); 
 
    elm.setAttribute('data-counter', ++counter) 
 
}
<button id="btn_rv" onclick="create_another_button(this)" data-counter="1">Main Button</button>

http://jsbin.com/tuwoxe/edit?html,css,js

+0

нет, я имею в виду, когда я нажимаю кнопку, которую она запускает еще одна кнопка с идентификатором btn_rv_1_1 и т. д. –

+0

Я только что обновил свой ответ. Это то, что вы ищете? –

+0

сэр, не могли бы вы добавить, что когда я нажму вторую кнопку, у вас будет другая кнопка с именем id "btn_rv_1_1" –

0

Я не получаю случай использования, но это должно быть то, что вы ищете:

var btn = document.createElement("input"); 
var countBtn; 
btn.type = "button"; 
btn.value = "button"; 
btn.id = "btn_rv"; 
document.body.appendChild(btn); 

btn.addEventListener('click', function(){ 
    if (!countBtn){ 
    countBtn = document.createElement("input"); 
    countBtn.type = "button"; 
    countBtn.value = 0; 
    countBtn.id = "btn_rv"; 
    document.body.appendChild(countBtn); 
    } 
    else{ 
    countBtn.value++; 
    } 

}, false); 

Проверьте это в https://jsfiddle.net/ugyknfc0/

+0

no sir, я имею в виду, когда я нажимаю кнопку, она запускает другую кнопку с идентификатором btn_rv_1 –

0

если вы хотите стрелять другую кнопку, попробуйте этот код

<input type="button" 
    id="BtnId" 
    onclick="fireButton();addButton();" /> 

Функция 1 для стрельбы по кнопке

function fireButton() 
{ 
    document.getElementById('btn_rv_1').click() 
} 

Функция 2 для добавления кнопки

function addButton() 
{ 
    var element = document.createElement("input"); 

//Assign different attributes to the element. 
    element.setAttribute("type", type); 
    element.setAttribute("value", type); 
    element.setAttribute("name", type); 


    var place= document.getElementById("SpanID"); 

//Append the element in page (in span). 
    place.appendChild(element); 
} 

В HTML

<span id="SpanID">&nbsp;</span> 
+0

да, я знаю это. но id должен быть btn_rv_1, и когда я нажимаю его, он должен создать еще одну кнопку btn_rv_1_1 –

+0

, так как вы можете вызывать две разные функции, такие как onClick = "fire(); addbutton()" – vinodh

+0

, но это не лучший способ, но вы можете легко получить ваш req – vinodh

0

Если вы хотите, попробуйте это.

HTML

<body> 
    <div id="top"> 
     <button id="button_1">Button 1</button> 
    </div> 
    <script type="text/javascript" src="func.js"></script> 
</body> 

func.js

var bid = 2; 

document.getElementById("button_1").addEventListener("click", function() { 
    add_button(bid); 
    add_event_listener(bid); 
    bid += 1; 
}); 

function add_button(button_id) { 
    var div = document.getElementById("top"); 
    div.innerHTML = div.innerHTML + "<button id='button_" + button_id + "'>Button " + button_id + "</button>"; 
} 

function add_event_listener(button_id) { 
    document.getElementById("button_" + button_id).addEventListener("click", function() { 
     add_button(bid); 
     add_event_listener(bid); 
     ++bid; 
    }); 
}