小编Riv*_*nat的帖子

如何使用PHP,jQuery和AJAX上传多个文件

我设计了一个简单的表单,允许用户将文件上传到服务器.最初,表单包含一个"浏览"按钮.如果用户想要上传多个文件,他需要点击"添加更多文件"按钮,在该表单中添加另一个"浏览"按钮.提交表单后,文件上载过程将在"upload.php"文件中处理.它适用于上传多个文件.现在我需要使用jQuery的'.submit()'提交表单,并将'ajax ['.ajax()']请求发送到'upload.php'文件来处理文件上传.

这是我的HTML表单:

<form enctype="multipart/form-data" action="upload.php" method="post">
    <input name="file[]" type="file" />
    <button class="add_more">Add More Files</button>
    <input type="button" id="upload" value="Upload File" />
</form>
Run Code Online (Sandbox Code Playgroud)

这是JavaScript:

$(document).ready(function(){
    $('.add_more').click(function(e){
        e.preventDefault();
        $(this).before("<input name='file[]' type='file' />");
    });
});
Run Code Online (Sandbox Code Playgroud)

以下是处理文件上传的代码:

for($i=0; $i<count($_FILES['file']['name']); $i++){
$target_path = "uploads/";
$ext = explode('.', basename( $_FILES['file']['name'][$i]));
$target_path = $target_path . md5(uniqid()) . "." . $ext[count($ext)-1]; 

if(move_uploaded_file($_FILES['file']['tmp_name'][$i], $target_path)) {
    echo "The file has been uploaded successfully <br />";
} else{
    echo "There was an error uploading the file, please try again! <br />"; …
Run Code Online (Sandbox Code Playgroud)

php ajax jquery multi-upload jquery-file-upload

45
推荐指数
2
解决办法
15万
查看次数

在form_dropdown中添加class和id

有没有在CodeIgniter的form_dropdown中添加class和id属性的方法?我试过form_dropdown('name',$array,'class','id'),它没有改变任何东西,请告诉我如何实现它?

编辑:
使用我的下拉表格,form_dropdown('name',$array,set_value('someValue'),'id="myId"');如果我从浏览器中看到我的来源,它看起来像这样<select name="provinsi" id="provinsi_id">,但是如果我按照你的方式写form_dropdown('name',$array,set_value('someValue'),'class="myClass"','id="myId"');我的浏览器来源<select name="provinsi" class="myClass">

那是我的意思,
谢谢你

select codeigniter codeigniter-form-helper drop-down-menu

11
推荐指数
1
解决办法
3万
查看次数

动画和过渡的组合不能正常工作

我一直试图把一些基本的CSS3动画.目标是在按钮的单击事件上切换类,并根据添加的类为div设置动画.该代码非常适合在Firefox中进行切换的第一次迭代,但对于Chrome等其他浏览器而言,在Firefox的下一次迭代中,转换是在眨眼之间切换.请帮我弄清楚出了什么问题.

片段:

$('button').click(function() {
  $('div').toggleClass('clicked');
});
Run Code Online (Sandbox Code Playgroud)
div {
  background-color: #ccc;
  height: 100px;
  width: 100px;
  transition-property: top, left;
  transition-duration: 1s;
  transition-timing-function: linear;
  position: relative;
  top: 0;
  left: 0;
}
.clicked {
  animation-name: clicked;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}
@keyframes clicked {
  0% {
    top: 0;
    left: 0;
  }
  100% {
    top: 100px;
    left: 100px;
  }
}
Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button">Click Me!</button>
<div></div>
Run Code Online (Sandbox Code Playgroud)

我也准备了小提琴这里.

javascript css3 css-transitions css-transforms css-animations

6
推荐指数
2
解决办法
617
查看次数

使用jQuery和Ajax启动Bootstrap Modal后,会多次出现Click事件处理程序

我设计了一个简单的模式,当用户尝试删除任何实体时,其工作方式类似于JavaScript.当用户单击"删除"图标时,在图标的单击事件上,将启动以下模式.

在此输入图像描述

如果用户单击"是",则发送ajax请求以删除该项目.它在发送第一个ajax请求时非常有效.但是当用户再次尝试执行相同的操作时,它会发送两个请求,以便继续进行下一次尝试.我无法弄清楚出了什么问题.

这是我的'删除图标'的HTML:

<a href="javascript:void(0)" class="btn btn-default">
<?php echo $item_name . " "; ?>
<i class="fa fa-times delete_item" data-url="<?php echo $url; ?>" data-item_id="<?php echo $item['id']; ?>" ></i></a>
Run Code Online (Sandbox Code Playgroud)

对于模态:

<div class="modal fade">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-body">
            <h5 style="text-align:center;">Do you want to delete this item?</h5>
            <br />
            <div>
                <button type="button" class="btn btn-danger pull-right confirm_delete">Yes</button>
                <button type="button" class="btn btn-default pull-right" data-dismiss="modal">No</button>
            </div>
            <br />
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是我的JavaScript:

$('body').on('click', '.delete_item', function(e){
e.preventDefault();
var url = $(this).data('url');
var data = 'item_id=' + …
Run Code Online (Sandbox Code Playgroud)

ajax jquery twitter-bootstrap bootstrap-modal

3
推荐指数
1
解决办法
3724
查看次数

将每种尺寸的图像调整为固定的宽度和高度

我尝试了很多方法来做到这一点,但我仍然有很多麻烦.

是否可以将所有图像调整为固定的宽度和高度?

我想每一个上传的图片与width>=200pxheight>=260px被调整到width=200pxheight=260px,但我想保持一点比例,如果图像是大于200x260px调整其大小比例,然后捕获图像的中心200x260px.

我只是想知道从哪里开始和做什么,但如果你有一个例子,我希望看到它.谢谢.

php image image-resizing

1
推荐指数
1
解决办法
1万
查看次数