xhtml mp的事件支持测试

以下是xhtml mp支持的事件,其中onload和onclick事件是规范规定浏览器必需支持的,其它为可选。具体哪种元素支持哪些事件,因浏览器不同而不同,可以修改以下代码进行测试。还附加了个XMLHttpRequest对象检测。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//OMA//DTD XHTML Mobile 1.2//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<title>DOM Events Test For XHTML Mobile Profile</title>
</head>
<body>
ajax:<label id="ajax"></label><br />
onload:<label id="load"></label><br />
onunload:<label id="unload"></label><br />
onclick:<label id="click"></label><br />
ondblclick:<label id="doubleclick"></label>
onmousedown:<label id="mousedown"></label><br />
onmouseup:<label id="mouseup"></label>
onmouseover:<label id="mouseover"></label><br />
onmousemove:<label id="mousemove"></label>
onmouseout:<label id="mouseout"></label><br />
onfocus:<label id="focus"></label>
onblur:<label id="blur"></label><br />
onkeypress:<label id="keypress"></label>
onkeydown:<label id="keydown"></label><br />
onkeyup:<label id="keyup"></label>
onsubmit:<label id="submit"></label><br />
onreset:<label id="reset"></label>
onselect:<label id="select"></label><br />
onchange:<label id="change"></label><br />

<form action="" method="get" id="f1">
  <input type="button" value="点击我" id="b1" />
  <input type="text" value="点击我" id="t1" />
</form>
<script type="text/javascript">
//<![CDATA[
  /**
   * Ajax支持判断
   */
  var xmlHttp;
  function createXMLHttp()
  {
    if (window.XMLHttpRequest)
    {
      xmlHttp = new XMLHttpRequest();
    }
    else if (window.ActiveXObject)
    {
      try
      {
        xmlHttp = new ActiveXObject('Msxml2.XMLHTTP');
      }
      catch(e)
      {
        try
        {
          xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
        }
        catch(e) {};
      }
    }
  }
  createXMLHttp();
  if (xmlHttp)
  {
    document.getElementById('ajax').innerHTML = "支持";
  }
  else
  {
    document.getElementById('ajax').innerHTML = "不支持";
  }
  /**
   * 从这里开始
   */
  function $(id)
  {
    return document.getElementById(id);
  }
  window.onload = function()
  {
    $('load').innerHTML = "支持";
    if (window.onresize)
    {
      $('resize').innerHTML = "支持";
    }
  }
  $('b1').onclick = function()
  {
    $('click').innerHTML = "支持";
    $('f1').onsubmit();
    $('f1').onreset();
  }
  $('b1').ondblclick = function()
  {
    $('doubleclick').innerHTML = "支持";
  }
  $('b1').onmousedown = function()
  {
    $('mousedown').innerHTML = "支持";
  }
  $('b1').onmouseup = function()
  {
    $('mouseup').innerHTML = "支持";
  }
	$('b1').onmouseover = function()
  {
    $('mouseover').innerHTML = "支持";
  }
	$('b1').onmousemove = function()
  {
    $('mousemove').innerHTML = "支持";
  }
	$('b1').onmouseout = function()
  {
    $('mouseout').innerHTML = "支持";
  }
	$('t1').onkeydown = function()
  {
    $('keydown').innerHTML = "支持";
  }
	$('t1').onkeypress = function()
  {
    $('keypress').innerHTML = "支持";
  }
	$('t1').onkeyup = function()
  {
    $('keyup').innerHTML = "支持";
  }
	$('t1').onfocus = function()
  {
    $('focus').innerHTML = "支持";
  }
	$('t1').onblur = function()
  {
    $('blur').innerHTML = "支持";
  }
	$('t1').onselect = function()
  {
    $('select').innerHTML = "支持";
  }
	$('t1').onchange = function()
  {
    $('change').innerHTML = "支持";
  }
	$('f1').onsubmit = function()
	{
		$('submit').innerHTML = "支持";
		return false;
	}
	$('f1').onreset = function()
  {
    $('reset').innerHTML = "支持";
    return false;
  }
//]]>
</script>
</body>
</html>
发表评论?

2 条评论。

  1. 楼主是否了解目前手机对xhtml mp版本支持如何?

  2. @kevin
    根据以前经验,2006年以后的主流手机浏览器对xhtml mp的各个版本支持都没有问题。不过现在大多数的手机页面为了保证兼容还在使用xhtml-mobile10.dtd

发表评论


注意 - 你可以用以下 HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>