如何根据img点击打开局部视图？ [英] How to open a partial view based on the img click?

问题描述

我写信给你是因为我有点失落。 
 
我想创建一个页面，其中有3个图像，每个图像都是可点击的。 
当我点击其中一个图像时，在同一页面上它应该显示为局部视图。 
 
如果我单击另一个图像，则所有其他部分视图应该消失，并仅显示所需的部分视图。 
 
我了解到，为了调用部分视图，命令行应该是：
< pre> 
 @ {
 Html.RenderPartial（_ Android）; 
} 

我是否需要在JS中编写脚本或者我可以制作一个c＃中的代码安静？

我最初应该怎么想？





提前致谢



我的尝试：

< pre>< div class =container-fluid> 
< h2> MDMSection< / h2> 
< p> .thumbnail类可用于显示图片库。< / p> 
< p> .caption类为缩略图内的文本添加适当的填充和深灰色。< / p> 
< p>点击图片查看所有Q& A< / p> 
< div class =row> 
< div class =col-md-4> 
< img alt =Bootstrap Image Previewsrc =http://lorempixel.com/140/140/class =img-rounded/> 
< div class =caption> 
< p> Android< / p> 
< / div> 
< / div> 
< div class =col-md-4> 
< img alt =Bootstrap Image Previewsrc =http://lorempixel.com/140/140/class =img-rounded/> 
< div class =caption> 
< p> iOS< / p> 
< / div> 
< / div> 
< div class =col-md-4> 
< img alt =Bootstrap Image Previewsrc =http://lorempixel.com/140/140/class =img-rounded/> 
< div class =caption> 
< p> Windows Phone< / p> 
< / div> 
< / div> 
< / div> 
< / div> 
< div> 
< br /> 
< / div> 
< div> 
< p> 
这里应该出现我的局部视图。 
< / p> 
 @ {
 Html.RenderPartial（_ Android）; 
} 
 @ {
 Html.RenderPartial（iOS）; 
} 
 @ {
 Html.RenderPartial（_ WindowsPhone）; 
} 
将/ DIV> 

解决方案

在链接点击上加载ASP.NET MVC部分视图dotnetthoughts [ ^ ]



上述解决方案完全不符合您的要求，但您至少可以了解如何实施。

I am writing you because I a bit lost.

I would like to create a page where there are 3 images, and each images are clickable.
When I click on one of the image, on the same page it should appear a partial view.

If I click another image, the all other partial view should disappear, and show only the partial view desired.

I have learned that in order to call a partial view the command line should be:
<pre>
@{
   Html.RenderPartial("_Android");
}

Do I need to do a script in JS or I can make a peace of code in c#?
What should I think at first?


Thanks in advance

What I have tried:

<pre><div class="container-fluid">
    <h2>MDMSection</h2>
    <p>The .thumbnail class can be used to display an image gallery.</p>
    <p>The .caption class adds proper padding and a dark grey color to text inside thumbnails.</p>
    <p>Click on the images to see all Q&A</p>
    <div class="row">
        <div class="col-md-4">
            <img alt="Bootstrap Image Preview" src="http://lorempixel.com/140/140/" class="img-rounded" />
            <div class="caption">
                <p>Android</p>
            </div>
        </div>
        <div class="col-md-4">
            <img alt="Bootstrap Image Preview" src="http://lorempixel.com/140/140/" class="img-rounded" />
            <div class="caption">
                <p>iOS</p>
            </div>
        </div>
        <div class="col-md-4">
            <img alt="Bootstrap Image Preview" src="http://lorempixel.com/140/140/" class="img-rounded" />
            <div class="caption">
                <p>Windows Phone</p>
            </div>
        </div>
    </div>
</div>
<div>
    <br/>
</div>
<div>
<p>
here it should appear my partial view.
</p>
@{
   Html.RenderPartial("_Android");
}
@{
   Html.RenderPartial("iOS");
}
@{
   Html.RenderPartial("_WindowsPhone");
}
</div>

解决方案

Load ASP.NET MVC partial views on link click | dotnetthoughts[^]

The above solution doesn't match with your requirement completely but, you can come to know how to implement at least.

这篇关于如何根据img点击打开局部视图？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！