Question

＆＃13;

function msg()
{
  if (document.getElementById('c1').checked);
    alert("suggest an update");
  }

＆＃13;

<input class="form-control" type="checkbox" id="c1" onclick="msg()" name="like"/>

＆＃13;

Answer 1

你可以用不同的方式进行表单弹出，其中一个是使用jQuery

这是example，可以完成你想做的事。

Answer 2

以下将生成一个带有一个文本输入元素的表单，很容易扩展它以包含许多其他元素。不能给出jquery的任何例子'因为我不使用它。

    <script type='text/javascript' charset='utf-8'>
        function msg(e) {
            var id='bob';
            var el=e.target || e.srcElement;
            if( el.checked ){

                var cont=document.getElementsByTagName('body')[0];                  
                var form=addNode('form',{id:id},cont);
                    form.style.width='500px';
                    form.style.height='500px';
                    form.style.zIndex=10;
                    form.style.border='1px solid black';
                addNode('input',{type:'text',name:'fred'},form);
            }else{
                if( document.getElementById(id) ) document.getElementById(id).parentNode.removeChild( document.getElementById(id) );
            }
        }
        function addNode( t, a, p ) {
            var el = ( typeof( t )=='undefined' || t==null ) ? document.createElement( 'div' ) : document.createElement( t );
            for( var x in a ) if( a.hasOwnProperty( x ) && x!=='innerHTML' ) el.setAttribute( x, a[ x ] );
            if( a.hasOwnProperty('innerHTML') ) el.innerHTML=a.innerHTML;
            if( p!=null ) typeof( p )=='object' ? p.appendChild( el ) : document.getElementById( p ).appendChild( el );
            return el;
        }
/*
The addNode function:
First argument is the type of element you wish to add.
Second argument is an object literal containing properties for the element you wish to set.
Third argument is the parent node to which you wish to append the new element/node.
*/
    </script>


html
----
<input class="form-control" type="checkbox" id="c1" onclick="msg(event)" name="like"/>

Answer 3

如果你使用Angularjs，我强烈推荐working demo example :。这是我最喜欢的弹出式。您只需创建一个包含弹出窗口内容的html文件，并在选中复选框后创建对话框实例（您可以使用ngDialog观看值更改）

选中一个复选框，动态创建弹出窗体

3 个答案: