Почему моя функция JavaScript не работает на всех моих кнопках?

Question

Можно ли вызвать функцию JavaScript для двух разных элементов с разными идентификаторами?

HTML

<p id="id1">12</p>
<button type="button" onClick="ABC(document.getElementById('id1').innerHTML)">one</button>

<input type="text" id="id2" value="21"/>
<button type="button" onClick="ABC(document.getElementById('id2').innerHTML)">two</button>

JS

function ABC(id = null) {
    if(id) {    
        $.ajax({
            url: 'url.php',
            type: 'post',
            data: {id: id},
            dataType: 'json',
            success:function(result) {
            }
        });  
    } 
} 

Функция не работает на второй кнопке, и я не знаю почему.

Answer 1

вторая кнопка использует входные данные, поэтому вы должны использовать document.getElementById ('id2'). Value

function ABC(id = null) {
    if(id) {    
        $.ajax({
            url: 'url.php',
            type: 'post',
            data: {id: id},
            dataType: 'json',
            success:function(result) {
            }
        });  
    } 
} 

<p id="id1">12</p>
<button type="button" onClick="ABC(document.getElementById('id1').innerHTML)">one</button>

<input type="text" id="id2" value="21"/>
<button type="button" onClick="ABC(document.getElementById('id2').value)">two</button>