点击图片重复

时间:2017-01-15 01:45:15

标签: javascript jquery css

如何防止我的图片在点击时重复出现。每次我点击图像时,同样的图像再次出现,我怎么能防止这种情况发生。我使用draggable和resizable也许这就是为什么这里发生的是一个快速代码



<script>// External added
    jQuery(download).ready(function () {
        jQuery(".file-upload-wrapper").hide();
        jQuery(".out-put-img1").hide();
        jQuery("#imajes45").change(function () {
            var selected = jQuery('#imajes45').val();
            if (selected == "new-upload") {
                jQuery(".file-upload-wrapper").show();
            } else {
                jQuery(".file-upload-wrapper").hide();
            }
        });

        //File
        function readURL(input) {

            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    jQuery(".out-put-img1").show();
                    $('#output1').attr('src', e.target.result);
//                   / $('.append-img').append('src', e.target.result);
                }
                reader.readAsDataURL(input.files[0]);
            }
        }
        jQuery("#upload-img1").change(function () {
            readURL(this);
			
	$(".samson").draggable();
$(".out-put-img1").resizable();
	

        });
    });
</script>

<script>
    // External added
    jQuery(download).ready(function () {
        jQuery(".file-upload-wrapper1").hide();
        jQuery(".out-put-img2").hide();
        jQuery("#imajes45").change(function () {
            var selected = jQuery('#imajes45').val();
            if (selected == "new-upload") {
                jQuery(".file-upload-wrapper1").show();
            } else {
                jQuery(".file-upload-wrapper1").hide();
            }
        });

        //File
        function readURL(input) {

            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    jQuery(".out-put-img2").show();
                    $('#output2').attr('src', e.target.result);
//                   / $('.append-img').append('src', e.target.result);
                }
                reader.readAsDataURL(input.files[0]);
            }
        }
        jQuery("#upload-img2").change(function () {
            readURL(this);
			
		$(".dragbal1").draggable();
$(".out-put-img2").resizable();
		
		
        });
    });
</script>
<script>
    // External added
    jQuery(download).ready(function () {
        jQuery(".file-upload-wrapper2").hide();
        jQuery(".out-put-img4").hide();
        jQuery("#imajes45").change(function () {
            var selected = jQuery('#imajes45').val();
            if (selected == "new-upload") {
                jQuery(".file-upload-wrapper2").show();
            } else {
                jQuery(".file-upload-wrapper2").hide();
            }
        });

        //File
        function readURL(input) {

            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    jQuery(".out-put-img4").show();
                    $('#output4').attr('src', e.target.result);
//                   / $('.append-img').append('src', e.target.result);
                }
                reader.readAsDataURL(input.files[0]);
            }
        }
        jQuery("#upload-img4").change(function () {
            readURL(this);
			
	$(".chinass2").draggable();
$(".out-put-img4").resizable();
		

        });
    });
</script>
&#13;
<div id="snake" class="samson">
<img id="output1" class="out-put-img1" style="position: absolute;top: 108px;right: 108px" height="80px" width="80px"></div>
<div id="lizard" class="dragbal1">
 <img id="output2" class="out-put-img2" style="position: absolute;top: 108px;right: 108px" height="80px" width="80px"></div>
<div id="rat" class="chinass2">
 <img id="output4" class="out-put-img4" style="position: absolute;top: 108px;right: 108px" height="80px" width="80px"></div>
&#13;
&#13;
&#13;

0 个答案:

没有答案