站內搜尋

Monday, September 10, 2012

[jQuery] 批次秀圖


隨手寫的應急程式碼,請大家見諒。

js的部分:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
function padLeft(str,lenght){
if(str.length >= lenght)
return str;
else
return padLeft("0" +str,lenght);
}

$("#submit").click(function() {
var inp_1 = $("#input_1").val();
var inp_2 = $("#input_2").val();
inp_2 = inp_2.length;
var inp_min = parseInt($("#input_min").val());   //字串轉整數
var inp_max = inp_min+5
var inp_3 = $("#input_3").val();
for (var i=inp_min;i<inp_max; i++) {
var str =padLeft(i,inp_2);
var newweb = inp_1+str+inp_3;
$("p:last").append("<img src='"+newweb+"' />");
}
var newpage = inp_max+1;
$("#input_min").val(newpage);
});
});
</script>

html的部分:
請輸入網址1:<input type="text" name="input_1" id="input_1" size="40" />
<br />
請輸入圖片編號的位數:<input type="text" name="input_2" id="input_2" value="***" /> (如為001,請輸入***)
<br />
請輸入圖片編號起始碼:<input type="text" name="input_min" id="input_min" />
<br />
請輸入圖片副檔名:<input type="text" name="input_3" id="input_3" value=".jpg" />
<br />
<a id="submit">submit</a>
<br />
<p>圖片如下:</p>

No comments:

Post a Comment