0

我是 jquery 和 web 编程和制作动态 html 控件的新手。

如果用户从组合框中选择一个值,我会创建一个用户选择的 html 控件。后

我删除了以前的 html 控件。

这是我想复制到另一个 div 的主要 div

<div id="MainContents" style="display: none" >
        <form action="../../newCV/AsyncUpload" id="photoform" enctype="multipart/form-data" method="post">
              <p> <input type="file" id="photo" name="photo" /></p>

            <p><input type="submit" value="Save my profile" /></p>
        </form>
    </div>      

这是我的 jqeurty 功能的一部分

case "Date":
                $('#c3').remove();
                $("<input name=\"c3\" id=\"c3\" type=\"date\"/>").appendTo("#changeablecontrol");

                break;

            case "Picture":

                $('#c3').remove();

                var html = "<div id=\"c3\" name=\"c3\"></div>";
                $(html).appendTo("#changeablecontrol");

                $('#MainContents').css('display', "inline").appendTo('#c3');

第一次,如果我选择图片,maintcontents div 追加到 div c3。没关系。但是如果我选择日期(删除 c3)并再次选择图片,那么它不会附加。因为当我选择日期时,它也会删除我表单中的 MainContents div。我不知道为什么它会删除 MainContents div。因为它在不同的部分。然后当我第二次在组合框中选择图片时,它不在我的表单中。

我尝试在 jquery 中使用 html 代码创建 maincontents,但那时,某些功能不起作用。

这是我的可变控件 div

  <div class="creatediv2" id="changeablecontrol">
    @Html.TextBox("c3","" ,new { onkeydown = "if (event.keyCode == 13) document.getElementById('create').click()" })
</div >

我用 append 而不是 appendTo

html += "<div id=\"MainContents\">"
                html += "<form id=\"photoform\"  action=\"../../NewCV/AsyncUpload\"   enctype=\"multipart/form-data\" method=\"post\">"; //method=\"post\"
                html += "<input type=\"file\" id=\"photo\" name=\"photo\" />";
                html += "<input type=\"submit\" id=\"uploadbtn\" value=\"Upload Photo\" /></form>";
                html += "</div>"
                $('#c3').append(html);

但是这个jquery函数不起作用

   $(function() {

            $("#photo").makeAsyncUploader({
                upload_url: "../newCV/AsyncUpload",
                flash_url: '../Scripts/swfupload.swf',
                button_image_url: '../../Content/blankButton.png',
                disableDuringUpload: 'INPUT[type="submit"]'
            });

        });

我希望我解释了我的问题..

4

2 回答 2

1

我不知道为什么它会删除 MainContents div。因为它在不同的部分。

不,这不对。您已将其附加到#c3,因此当您删除(删除)#c3 时,您也会删除他的所有子项。也许你应该使用 append(),而不是 appendTo() 函数?

于 2012-12-31T13:13:34.407 回答
0

正如 bumerang所说,我为每个控件创建了 div,并将它们的显示值从隐藏更改为继承。

  <div class="creatediv2" id="changeablecontrol">

      <div id="filecontent" style="display: none" >
        <form action="/NewCV/AsyncUpload" id="photoform" enctype="multipart/form-data" method="post">
              <p> <input type="file" id="photo" name="photo" /></p>

            <p><input type="submit" value="Save my profile" /></p>
        </form>


  </div>     

<div id="textcontent" style="display: inherit">
    <input id="c3-1" name="c3" onkeydown="if (event.keyCode == 13) document.getElementById('create').click()" type="text" value="" />

</div>

<div id="longtextcontent" style="display: none">
      <textarea name="c3" id="c3-2" rows="5" cols="20"></textarea>
</div>

<div id="datecontent" style="display: none">
       <input name="c3" id="c3-3" type="date"/>
</div>


    </div >

我的 jsquery 函数

    <script type="text/javascript">
        $(function() {

            $("#photo").makeAsyncUploader({
                upload_url: "/newCV/AsyncUpload",
                flash_url: '/Scripts/swfupload.swf',
                button_image_url: '/Content/blankButton.png',
                disableDuringUpload: 'INPUT[type="submit"]'
            });

        });
    </script> 

而这个正在改变显示器的价值

  var val = cmb.options[cmb.selectedIndex].text;

        switch (val) {
            case "Text":
                $('#textcontent').css('display', 'inherit');
                $('#longtextcontent').css('display', 'none');
                $('#datecontent').css('display', 'none');
                $('#filecontent').css('display', 'none');

                break;
               case "Long Text":

                $('#textcontent').css('display', 'none');
                $('#longtextcontent').css('display', 'inherit');
                $('#datecontent').css('display', 'none');
                $('#filecontent').css('display', 'none');

                break;

            case "Date":

                $('#textcontent').css('display', 'none');
                $('#longtextcontent').css('display', 'none');
                $('#datecontent').css('display', 'inherit');
                $('#filecontent').css('display', 'none');

                break;

            case "Picture":

                $('#textcontent').css('display', 'none');
                $('#longtextcontent').css('display', 'none');
                $('#datecontent').css('display', 'none');
                $('#filecontent').css('display', 'inherit');
                break;

        default:

            break;
        }

谢谢你 :)

于 2012-12-31T14:16:25.660 回答