研究日誌 - 1380461699 - したらば掲示板

研究日誌

124：名無しさん：2014/02/18(火) 07:44:58: 【共通】ヤフートピ知恵袋ツール修正

自作ツール「ヤフートピックス知恵袋ツール」の修正をしました。
主な修正は以下です。
１.自作スタイルシートを適用する
２.ヤフー知恵袋APIの検索結果を回答完了のもののみに絞る。

基本的には、「RSSツール」や「週間天気予報」と同じ修正をすれば
いいので、簡単にできるかと思っていましたが１の方は苦戦しました。

このツールでは、入力のHTML画面で検索をするため、formタグを
つかってsubmitするボタンがありました。
以下が元々のボタンのHTML文になります。

<input type="submit" value="　送　信　">

これをスタイルシートが適用してサブミットできるようにする方法
がなかなかわからず苦戦しました。

最初は、

【 <a href～でフォームをサブミットさせる】
http://hosacheese.jugem.jp/?eid=20
【[HTML]aタグでsubmitしたい！】
http://ntter0.blog76.fc2.com/blog-entry-21.html
のページに紹介されていた。

<a href="#" onclick="document.formName.submit()">投稿する</a>

<a href="javascript:void(0)" onclick="document.formA.submit();return false;">click here</a>

みたいなアンカータグでやる方法を試していましたが、なぜかボタンを
押しても反応しませんでした。

原因がよくわからないのでアンカータグをあきらめて

【フォームのsubmitボタンのデザインを変更する方法（CSS）】
http://monopocket.jp/blog/css/1113/

のページに出ていた方法を参考に強引にインプットタグを勘で修正。

<input id="buttonx" style="width:250px" onmouseover="this.style.background='#43cd80'" onmouseout="this.style.background='#337fcc'" onclick="this.style.background='#43cd80'" type="submit" value="　送　信　">

これでやっと動きました。以下は「RSSツール」でもつかっている
自作スタイルシートです。

<style type="text/css">
<!--
#buttonx {
width:300px;
color:#ffffff;
background:#337fcc;
font-family: fantasy,sans-serif;
font-size:24px;
font-weight:bold;
text-shadow:0 1px 0px #143352,0 2px 0px #143352;
text-align:center;
display:inline-block;
text-decoration:none;
border:1px solid #225588;
padding:20px 0 16px 0;
border-radius:5px;
margin-bottom:20px;
}

HTMLの知識が足らないので不十分な点もあるかもしれませんが
とりあえず動きました。

２の方は、以下のAPIの説明ページにしたがってconditionパラメータを
設定しただけなのですぐに修正できました。

【質問検索API 】
http://developer.yahoo.co.jp/webapi/chiebukuro/chiebukuro/v1/questionsearch.html

【ヤフートピックス知恵袋ツールの入力画面、出力画面画像、プログラム、HTML】
https://db.tt/LwcorgL8

あと、自作ツールでは「置換ツール」がHTMLをつかっているので
また時間のあるときに治そうかなと思っています。

2chMate 0.8.6/unknown/L01A/4.0.3/LT

※書き込む際の注意事項はこちら

※画像アップローダーはこちら

（画像を表示できるのは「画像リンクのサムネイル表示」がオンの掲示板に限ります）