добавить ввод изображения с помощью jquery с ограничением до четырех

Question 1

У меня есть код, с помощью которого пользователь может загружать изображения. Он работает нормально, но пользователь может отправлять неограниченное количество изображений, и я хочу установить ограничение до четырех.

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

     <script type="text/javascript">


function addItems()
{
var table1 = document.getElementById('tab1');
var newrow = document.createElement("tr");
var newcol = document.createElement("td");
var input = document.createElement("input");
input.type="file";
input.name="image[]";
newcol.appendChild(input);
newrow.appendChild(newcol);
table1.appendChild(newrow);
}

function remItems()
{
var table1 = document.getElementById('tab1');
var lastRow = table1.rows.length;
if(lastRow>=2)
table1.deleteRow(lastRow-1);
}
</script>


    <form method="post" action="" enctype="multipart/form-data">
<table align="center" border="0" id="tab1">
<tr>
<td width="218" align="center">
<input type="file" name="image[]" /></td>
<td width="54" align="center">
<img src="Button-Add-icon.png" alt="Add" style="cursor:pointer" 

 onclick="addItems()" /></td>
<td>
<img src="Button-Delete-icon.png" alt="Remove" style="cursor:pointer"  

  onclick="remItems()" /></td>
</tr>
</table>
<table align="center" border="0" id="tab2">
<tr><td align="center">
<input type="submit" value="Upload" name="upload" /></td></tr>
</table>
</form>

Благодарность

javascript jquery

0

Rocks 11 Июн 2012 в 23:16

Вы хотите сделать это в jQuery? Код, который вы здесь разместили, полностью использует обычный javascript. Просьба уточнить.

–

raddykrish

11 Июн 2012 в 23:19

1

Добавьте отметку в addItems() для количества входов в вашем текущем в таблице.

–

dnagirl

11 Июн 2012 в 23:21

Я даже не вижу формы в вашем коде.

–

j08691

11 Июн 2012 в 23:29

Answer

Добавьте глобальный счетчик .. и проверьте свою функцию addItems .. что-то вроде:

var totalItems = 0;
function addItems()
{
   if(totalItems < 4) {
     var table1 = document.getElementById('tab1');
     var newrow = document.createElement("tr");
     var newcol = document.createElement("td");
     var input = document.createElement("input");
     input.type="file";
     input.name="image[]";
     newcol.appendChild(input);
     newrow.appendChild(newcol);
     table1.appendChild(newrow);
     totalItems++; //increment the global counter...
   } else {
    //Display your message here.. with an alert or something...
   }
}

function remItems()
{
   var table1 = document.getElementById('tab1');
   var lastRow = table1.rows.length;
   if(lastRow>=2) {
     table1.deleteRow(lastRow-1);
     totalItems--; 
    }
}

0

Deleteman 11 Июн 2012 в 23:38

Question 2

Добавьте глобальный счетчик .. и проверьте свою функцию addItems .. что-то вроде:

var totalItems = 0;
function addItems()
{
   if(totalItems < 4) {
     var table1 = document.getElementById('tab1');
     var newrow = document.createElement("tr");
     var newcol = document.createElement("td");
     var input = document.createElement("input");
     input.type="file";
     input.name="image[]";
     newcol.appendChild(input);
     newrow.appendChild(newcol);
     table1.appendChild(newrow);
     totalItems++; //increment the global counter...
   } else {
    //Display your message here.. with an alert or something...
   }
}

function remItems()
{
   var table1 = document.getElementById('tab1');
   var lastRow = table1.rows.length;
   if(lastRow>=2) {
     table1.deleteRow(lastRow-1);
     totalItems--; 
    }
}

0

Deleteman 11 Июн 2012 в 23:38

добавить ввод изображения с помощью jquery с ограничением до четырех

1 ответ

Похожие вопросы

Новые вопросы

javascript