這是我從jsfiddle得到的答案。它在小提琴部分工作,但當它移動到我的電腦時它不起作用。我替換了我的程序中的代碼,並且還包含了所有的外部資源庫。但是,它仍然沒有工作。jquery在JSFiddle中工作,但不適用於計算機
var x = 1;
function appendRow() {
var newTextBoxDiv = $(document.createElement('div'))
.attr("id", 'TextBoxDiv' + x);
// I ASSIGNED A CLASS CALLED INPUT TO THE ELEMENT YOU WANT TO SELECT
newTextBoxDiv.after().html("<div class='form-group'><label class='control-label col-sm-3' style='text-align:right;'>Date:</label><div class='col-sm-3'><div class='input-group date' ><span class='input-group-addon'><i class='fa fa-calendar'></i></span><input type='Date' class='form-control' name='Dates'> <select class='form-control input' id='slct" + x + "' name='Branch''><option disabled='' selected=''>Please Select Leave Day</option> <option value='1' >1</option><option value='0.5' >0.5</option></select></div></span></div><div id='container" + x + "'></div></div>");
newTextBoxDiv.appendTo("#div");
x++;
}
function changeIt(rowIndex) {
//i++; DO NOT INCREMENT I!!! IT WILL CREATE THE REFERRAL ERROR YOU HAD. BECAUSE THE FUNCTION WOULD BE REFERRING TO A NON-EXISTING INPUT ELEMENT. I REPLACED IT WITH ROWINDEX, WHICH IS INITIATED WHILE CALLING THE FUNCTION
var select = document.getElementById("slct" + rowIndex);
var divv = document.getElementById("container" + rowIndex);
var value = select.value;
if (value == 0.5) {
toAppend = "<label class='control-label col-sm-1'>Time:</label><div class='col-sm-2'><div class='input-group date' id = 'date'> <span class='input-group-addon'><i class='fa fa-clock-o'></i></span><input type='time' class='form-control' ></div></div><div class='col-sm-2'><div class='input-group date' id = 'dates'> <span class='input-group-addon'><i class='fa fa-clock-o'></i></span><input type='time' class='form-control' ></div></div>";
divv.innerHTML = toAppend;
return;
}
if (value == 1) {
toAppend = "";
divv.innerHTML = toAppend;
return;
}
}
$("#button").click(function() {
appendRow();
});
$("#div").on("change", ".input", function() {
//EXTRACT THE NUMBER FROM THE CLICKED ITEM'S ID
let rowIndex = $(this).attr("id").replace(/.[^0-9]/g, "");
changeIt(rowIndex);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div">
<button value="Add Row" id="button">Add row</button>
</div>
在控制檯中是否有錯誤? – guradio
以前沒有在我以前的版本代碼中有錯誤,但現在這是答案修改,並在小提琴中工作,但是當我嘗試合併它在我的代碼中,甚至創建一個新的文件來處理此代碼也不能得到它的工作。 它應該能夠添加文本框,並且當選擇0.5時能夠出來時間文本框 – user3168370
'appendRow();'在文檔內部。 ready'?拿出來...這個'changeIt(rowIndex);'以及 – guradio