ASP.NET 오류 : "자식 요소가 닫히기 전에 부모 컨테이너 요소를 수정할 수 없습니다."

Question

메신저를 만드는 데 큰 문제가 있습니다. 웹 페이지에서 특정 속성에 대한 편집기를 반환하는 메서드를 작성해야합니다. 색상의 메소드는 "JQUERY Colorpicker from eyecon.ro"를 구현합니다.

private static string GetColorBox(string name, int width, string value) 
{ 
    return "<input type=\"text\" maxlength=\"6\" size=\"6\" id=\"colorPickerHolder" + name + "\" value=\"000000\" />" + 
     "<script type=\"text/javascript\">" + 
     "$('#colorPickerHolder" + name + "').ColorPicker(" + 
     "{" + 
      "onSubmit: function(hsb, hex, rgb, el) " + 
      "{" + 
      "$(el).val(hex);" + 
      "$(el).ColorPickerHide();" + 
      "}," + 
      "onBeforeShow: function() " + 
      "{" + 
      "$(this).ColorPickerSetColor(this.value);" + 
      "}" + 
     "})" + 
     ".bind('keyup', function()" + 
     "{" + 
      "$(this).ColorPickerSetColor(this.value);" + 
     "});" + 
    "</script>"; 
} 

나는이 방법에 여러 통화를하지만 첫 번째 호출 후 두 번째는 불평이 :

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; GTB6; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; InfoPath.1; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729) Timestamp: Mon, 9 Nov 2009 19:35:33 UTC

Message: HTML Parsing Error: Unable to modify the parent container element before the child element is closed (KB927917) Line: 0 Char: 0 Code: 0 URI: http://localhost:1442/Slide/CreateTemplateSlide/33

가이 같은 나타납니다 표시하기위한 HTML : 나는 더이

<tr> 
    <td width="150px" nowrap="nowrap"> 
     Text color: 
    </td> 
    <td> 
     <input type="text" maxlength="6" size="6" id="colorPickerHolderTextColor" value="000000" /><script type="text/javascript">$('#colorPickerHolderTextColor').ColorPicker({onSubmit: function(hsb, hex, rgb, el) {$(el).val(hex);$(el).ColorPickerHide();},onBeforeShow: function() {$(this).ColorPickerSetColor(this.value);}}).bind('keyup', function(){$(this).ColorPickerSetColor(this.value);});</script> 
    </td> 
</tr> 

<tr> 
    <td width="150px" nowrap="nowrap"> 
     Text size: 
    </td> 
    <td> 
     <input name="TextSize" width="5px" type="text" value=""></input> 
    </td> 
</tr> 

<tr> 
    <td width="150px" nowrap="nowrap"> 
     Background color: 
    </td> 
    <td> 
     <input type="text" maxlength="6" size="6" id="colorPickerHolderBackColor" value="000000" ><script type="text/javascript">$('#colorPickerHolderBackColor').ColorPicker({onSubmit: function(hsb, hex, rgb, el) {$(el).val(hex);$(el).ColorPickerHide();},onBeforeShow: function() {$(this).ColorPickerSetColor(this.value);}}).bind('keyup', function(){$(this).ColorPickerSetColor(this.value);});</script> 
    </td> 

을 실마리가 왜 이런 일이 일어나고 있는지, 어떤 사람이 저를 올바른 방향으로 가르키고 있는지에 대한 단서가 있습니까?

Answer 1

script 태그 앞에 input 태그를 닫으십시오.

EDIT : 해당 호출에서 스크립트 부분을 제거하고 특정 클래스에서 작동하는 전용 부분을 만들 수도 있습니다.

private static string GetColorBox(string name, int width, string value) 
{ 
    return "<input class=\"myParticularColorBoxingClass\" type=\"text\" maxlength=\"6\" size=\"6\" id=\"colorPickerHolder" + name + "\" value=\"000000\" >"; 
} 

EDIT2

: 당신이 직접 페이지에 추가하여, 한 번만 스크립트를 실행할 수 있습니다.
페이지에 넣으시겠습니까?
class=\"myParticularColorBoxingClass\"을 기억하십시오 (위의 방법 참조).

<script type="text/javascript"> 
    //run this after document has finished loading! 
    $(document).ready(
     function() { 
     //activate all inputs with "myParticularColorBoxingClass" class 
     $('input .myParticularColorBoxingClass').ColorPicker(
       { 
        onSubmit: function(hsb, hex, rgb, el) 
        { 
        $(el).val(hex); 
        $(el).ColorPickerHide(); 
        }, 
        onBeforeShow: function() 
        { 
        $(this).ColorPickerSetColor(this.value); 
        } 
       }) 
       .bind('keyup', function() 
       { 
        $(this).ColorPickerSetColor(this.value); 
       }); 
     } 
    ); 
</script>