Yii 框架结合 Upload 插件实现 AJAX 图片上传是一种常见的前端与后端交互方式，它可以提供更好的用户体验，因为用户无需刷新整个页面就能完成图片上传。以下将详细讲解这一方法的具体步骤和关键技术。
我们需要在控制器（Controller）中创建一个处理 AJAX 请求的特定动作（Action）。例如，在 `SiteController` 中，可以创建一个名为 `getAjax` 的动作：
```php
public function actionGetAjax()
{
$model = new Attachment();
$tmpFile = CUploadedFile::getInstanceByName('image');
$Directroy = Yii::app()->params['uploadPath'];
$y = date('Y');
$m = date('m');
$d = date('d');
$pathd = $Directroy . $y . "/" . $m . "/" . $d . "/";
Tool::makedir(dirname(Yii::app()->basePath) . $pathd); // 创建文件存放路径
if (is_object($tmpFile) && get_class($tmpFile) === 'CUploadedFile') {
// 处理图片文件
...
}
// 保存模型数据并处理文件
if ($model->save()) {
$tmpFile->saveAs(dirname(Yii::app()->basePath) . $uploadfile);
// 可选：进行图片处理，如生成缩略图
...
}
}
```
在上面的代码中，我们首先创建了一个 `Attachment` 模型实例来存储上传的文件信息。然后，通过 `CUploadedFile::getInstanceByName()` 获取到前端通过 AJAX 上传的图片文件对象。接下来，根据日期创建一个文件夹结构，并确保目录存在。如果文件是有效的图片格式（如 JPG、GIF 或 PNG），我们将进行一系列的处理，包括保存文件、生成不同尺寸的缩略图等。
在模型（Model）中，我们需要定义相应的字段来存储图片信息，例如：
```php
class Attachment extends CActiveRecord
{
public $zat_url;
public $zat_file_name;
public $zat_title;
public $zat_file_type;
public $zat_file_size;
public $zat_image;
public $zat_thumb;
public $zat_ip;
// ...其他模型方法
}
```
前端方面，我们需要使用 JavaScript 和 AJAX 来发送文件上传请求。可以使用 jQuery 提供的 `$.ajax` 或 `$.post` 方法。这里假设你有一个表单，包含一个名为 `image` 的 `input[type=file]` 元素：
```html
<form id="upload-form">
<input type="file" name="image" id="image-input">
<button type="submit">上传</button>
</form>
```
对应的 JavaScript 代码：
```javascript
$(document).ready(function() {
$('#upload-form').on('submit', function(event) {
event.preventDefault();
var formData = new FormData(this);
$.ajax({
url: '/site/getAjax', // 调用上面定义的 actionGetAjax
type: 'POST',
data: formData,
cache: false,
contentType: false,
processData: false,
success: function(response) {
// 处理返回的数据，如显示上传成功提示
},
error: function() {
// 处理错误情况
}
});
});
});
```
至此，你已经了解了如何使用 Yii 框架结合 AJAX 和 Upload 插件实现图片上传的基本流程。需要注意的是，这只是一个基础示例，实际项目中可能需要考虑更多的细节，比如错误处理、文件大小限制、文件类型检查、权限控制等。同时，前端的响应处理和图片预览功能也需要根据具体需求进行完善。
