Monthly Archives: 6月 2018

「jQuery入門」lengthで要素が存在するか判定サンプル

1.htmlコード
<div class=”cft”>data-AA</div>
<div class=”kdf”>data-BB</div>
<div class=”cft”>data-AA</div>
<div class=”hyl”>data-CC</div>
<button>length要素チェック</button>
<p id=”result”></p>

2.JSコード
$(‘button’).click(function(){
if( $(‘.kdf’).length == 0){
$(‘#result’).text(‘data-BBが存在しません。’)
}else{
$(‘#result’).text(‘data-BBが存在します。’)
}
})

「jQuery入門」filter()メソッドの使い方

サンプル1
1.1 htmlコード
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
<li>list item 6</li>
</ul>
1.2 JSコード
$(‘li’).filter(‘:even’).css(‘background-color’, ‘red’);

サンプル2
2.1 htmlコード
<ul>
<li><strong>list</strong> item 1 – one strong tag</li>
<li><strong>list</strong> item <strong>2</strong>
– two <span>strong tags</span></li>
<li>list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
<li>list item 6</li>
</ul>
2.2 JSコード
$(‘li’).filter(function(index) {
return $(‘strong’, this).length == 1;
}).css(‘background-color’, ‘green’);

「JavaScript入門」call()でthisの値をコントロールする

サンプルコード
var cftObject = {}
var cftFunction = function(pp1, pp2){
this.a = pp1;
this.b = pp2;
console.log(this);
}

cftFunction.call(cftObject, ’31’,’32’);
console.log(cftObject);
//出力:Object { a: “31”, b: “32” }

「JavaScipt入門」onclick=function(e)を利用するサンプル

1.htmlコード
<div id=”cftDiv”>
<input type=”button” value=”testButtonOne” id=”btn1″>
<input type=”button” value=”testButtonTwo” id=”btn2″>
<input type=”button” value=”testButtonThree” id=”btn3″>
</div>

2.JSコード
<script type=”text/javascript”>
document.getElementById(“cftDiv”).onclick=function(e){
e=window.event||e;
var btnId=e.target.id;
switch(btnId){
case “btn1”:
console.log(“testButtonOne”);
break;
case “btn2”:
console.log(“testButtonTwo”);
break;
case “btn3”:
console.log(“testButtonThree”);
break;
}
}
</script>

「jQuery入門」formでEnterを無効にするサンプル

JSコード
$(‘#cftForm’).keypress(function(e){
if (e.which == 13) {
return false;
}
});

「jQuery入門」フィルタリングで要素を絞り込むサンプル

1. タグ名=”input” と name属性が”model.cftKdfBean.address.value”と一致
$(‘input[name=”model.cftKdfBean.address.value”]’);

2. タグ名=”input” と name属性が”model.cftKdfBean.address.value”と不一致
$(‘input[name!=”model.cftKdfBean.address.value”]’);

3. タグ名=”input” と name属性が”model.cftKdfBean.address.value”と先頭一致
$(‘input[name^=”model.cftKdfBean.address.value”]’);

4. タグ名=”input” と name属性が”model.cftKdfBean.address.value”と末尾一致
$(‘input[name$=”model.cftKdfBean.address.value”]’);

5. タグ名=”input” と name属性が”model.cftKdfBean.address.value”と部分一致
$(‘input[name*=”model.cftKdfBean.address.value”]’);

ubuntu 14.04/16.04にdockerのプロキシを設定するメモ

アップデート
$ sudo apt-get update
$ sudo apt-get upgrade docker-engine

1.proxy設定の変更
$ sudo mkdir /etc/systemd/system/docker.service.d
$ sudo touch /etc/systemd/system/docker.service.d/http-proxy.conf
$ sudo vi /etc/systemd/system/docker.service.d/http-proxy.conf

2.プロキシの設定ファイルの変更
/etc/systemd/system/docker.service.d/http-proxy.conf
[Service]
Environment=”HTTP_PROXY=http://proxy.abcde.com:80/” “NO_PROXY=localhost,127.0.0.1”

3.設定内容の反映
$ sudo systemctl daemon-reload
$ systemctl show –property=Environment docker
Environment=HTTP_PROXY=http://proxy.abcde.com:80/ NO_PROXY=localhost,127.0.0.1
$ sudo systemctl restart docker

「Jquery入門」 text()、html() とval()のサンプル

JSコード
$(“#btn1”).click(function(){
$(“#cftTest1”).text(“Hello world!”);
});
$(“#btn2”).click(function(){
$(“#cftTest2”).html(“<b>Hello world!</b>”);
});
$(“#btn3”).click(function(){
$(“#cftTest3”).val(“test data”);
});