我使用jQuery创建了一个Image Slider,但它并不是随机工作的。重新加载页面后,我收到以下错误:
Uncaught TypeError: Cannot read property 'indexOf' of undefined
at i.fn.init.i.fn.load (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at HTMLImageElement.<anonymous> (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
at Function.each (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at i.fn.init.each (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at HTMLImageElement.<anonymous> (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
at Function.each (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at i.fn.init.each (jquery?v=eJAcMfrInnLuvmR6YmGFt2ky0cO2ssn2OaxtB6iWFKQ1:1)
at et (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
at ft (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
at k (slider?v=iXGFgGvKoKTyJMnF1faQOZMvYM6od0eK7irNUQ3FiMg1:1)
控制器:
public class SliderController : Controller
{
// GET: Slider
public ActionResult Index()
{
using (BasDbContext db = new BasDbContext())
{
return View(db.gallery.ToList());
}
//return View();
}
//Add Images in slider
public ActionResult AddImage()
{
return View();
}
[HttpPost]
public ActionResult AddImage(HttpPostedFileBase ImagePath)
{
if (ImagePath != null)
{
// You can skip this block, because it is only to force the user to upload specific resolution pics
//System.Drawing.Image img = System.Drawing.Image.FromStream(ImagePath.InputStream);
//if ((img.Width != 800) || (img.Height != 356))
//{
// ModelState.AddModelError("", "Image resolution must be 800 x 356 pixels");
// return View();
//}
// Upload your pic
string pic = System.IO.Path.GetFileName(ImagePath.FileName);
string path = System.IO.Path.Combine(Server.MapPath(@"\cdm\Content\images\"), pic);
ImagePath.SaveAs(path);
using (BasDbContext db = new BasDbContext())
{
Gallery gallery = new Gallery { ImagePath = @"\cdm\Content\images\" + pic };
db.gallery.Add(gallery);
db.gallery.Add(gallery).DateAdded = gallery.DateAdded = DateTime.Now;
db.SaveChanges();
}
}
return RedirectToAction("Index");
}
// Delete Multiple Images
public ActionResult DeleteImages()
{
using (BasDbContext db = new BasDbContext())
{
return View(db.gallery.ToList());
}
}
[HttpPost]
public ActionResult DeleteImages(IEnumerable<int> ImagesIDs)
{
using (BasDbContext db = new BasDbContext())
{
try
{
foreach (var id in ImagesIDs)
{
var image = db.gallery.Single(s => s.ID == id);
string imgPath = Server.MapPath(image.ImagePath);
db.gallery.Remove(image);
if (System.IO.File.Exists(imgPath))
System.IO.File.Delete(imgPath);
}
db.SaveChanges();
}
catch
{
TempData["AlertMessage"] = "Something went wrong, try again";
}
}
return RedirectToAction("DeleteImages");
}
}
}
指数:
@model IEnumerable<ConcremoteDeviceManagment.Models.Gallery>
@{
ViewBag.Title = "Index";
//Layout = "~/Views/Shared/_Layout.cshtml";
}
@if (TempData["AlertMessage"] != null)
{
<p class="alert alert-danger" id="successMessage">@TempData["AlertMessage"]</p>
}
<h2>Index</h2>
<p>
<button onclick="location.href='@Url.Action("AddImage", "Slider")';return false; " class="btn btn-primary">Add Image</button>
<button onclick="location.href='@Url.Action("DeleteImages", "Slider")';return false; " class="btn btn-danger">Delete Image</button>
</p>
@Html.Partial("~/Views/Shared/SliderPartial.cshtml", Model)
SliderPartial:
<div class="bxslider">
@foreach (var image in Model)
{
<div><img src="@Url.Content(image.ImagePath)" /></div>
}
</div>
<script>
$(document).ready(function () {
$('.bxslider').bxSlider({
mode: 'fade',
captions: true,
slideWidth: 600
});
});
</script>
我认为SliderPartial出了问题。 控制器和指数似乎没问题。
我希望有人能够帮助我。 更多信息将在需要时提供